Saya cukup baru di JavaScript dan mencoba membuat gambar saya dari RGB ke Grayscale sambil menggulir ke bawah dan sebaliknya. Saya mengatur gambar saya untuk mendapatkan nilai abu-abu saat menggulir namun saya tidak kembali ke gambar RGB.

Kode saya untuk JavaScript adalah:

let element = document.getElementById("image");




window.onscroll = function() {
  var scrollLimit = 100;
  if (window.scrollY >= scrollLimit) {
    element.style.filter = 'grayscale(1)';
  } else {
    element.src =    'ttps://images.unsplash.com/photo-1542903660-eedba2cda473?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1170&q=80'
    
    
  }
};

Ini juga publik di https://jsfiddle.net/vdszymh7/139/

Mungkin Anda memiliki beberapa saran bagaimana mengubah secara dinamis antara dua mode ini.

0
user17523218 27 November 2021, 13:23

1 menjawab

Jawaban Terbaik

Apa yang ingin Anda capai dapat dilakukan dengan cara ini:

window.onscroll = function() {
  var scrollLimit = 100;
  if (window.scrollY >= scrollLimit) {
    element.style.filter = 'grayscale(1)';
    console.log('gray')
  } else {
    element.style.filter = 'none'
  }
};
0
p4avinash 27 November 2021, 13:34
Terima kasih. Itu saja. Terkadang solusinya sangat sederhana..
 – 
user17523218
27 November 2021, 13:40
Sama-sama sobat, Anda dapat memberikan solusi ini upvote..!! ;-)
 – 
p4avinash
27 November 2021, 13:43