title: Image switch with data-attribute
body: <pre><code>$(window).scroll(function() {    
      var scroll = $(window).scrollTop();
      if (scroll &gt;= 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"));
      }
  });
  </code></pre>
  
  <p>The first one works but the src is not coming back anymore. How should this be done?</p>
  
  <pre><code>&lt;img src="img/logo2.png" data-hover="img/logo.png" alt="" class="img-responsive" /&gt;
  </code></pre>