データ属性付き画像スイッチ

Question

$(window).scroll(function() {  
    var scroll = $(window).scrollTop(); 
    if (scroll >= 50) { 
     $("header").addClass("sticky"); 
     $('header .logo a img').attr('src', $('header .logo a img').data("hover")); 
    } else { 
     $("header").removeClass("sticky"); 
     $("header").addClass(""); 
     $('header .logo a img').attr('src', $('header .logo a img').data("src")); 
    } 
}); 

最初のものは動作しますが、srcはもう戻ってこないです。これはどのように行うべきですか？あなたが.data("src")を行うと

<img src="img/logo2.png" data-hover="img/logo.png" alt="" class="img-responsive" /> 

Answer 1

を使用し、より良い、.dataを使用しないでください。

<img src="img/logo2.png" data-src="img/logo2.png" data-hover="img/logo.png" alt="" class="img-responsive" /> 

Answer 2

Javascriptを画像要素にdata-src属性を探しているが、あなたの画像要素はsrcを持っています。

はあなたがアクセスしようとdata-src属性を追加する必要があり.attr("data-hover")と.attr("src")