0

Como troco o SRC da imagem (Com JQuery) ao descer a página e o scroll for maior que 10?

Trocar o

<img src="imagem_1.png" alt="Meu site">

pelo

<img src="imagem_2.png" alt="Meu site">

E depois ele voltar pra

<img src="imagem_1.png" alt="Meu site">

quando o scroll for menor que 10.

1 Resposta 1

3

Com jquery

$(window).scroll(function () {
    //console.log($(document).scrollTop());
    if ($(document).scrollTop() >= 10) {
        $('img').attr('src', 'imagem_2.png');
    } else {
        $('img').attr('src', 'imagem_1.png');
    }
}); 

Com JS puro

var onScrollHandler = function() {
  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  if (scrollTop >= 10) {
     seuElemento.src = "imagem2.png"
  }else{
     seuElemento.src = "imagem1.png"
  }
};
object.addEventListener ("scroll", onScrollHandler);

*Nota que com javascript o seuElemento tem que ser substituído pelo elemento que tu quer adicionar a imagem, no caso sugiro você a colocar um id na sua img e utilizar o método getElementById() passando o id que foi atribuído.

1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .