jQuery Plugin For Swapping Out Images On Hover - Hover.js

Just another jQuery image rollover plugin which swaps out image sources on mouse hover event.

How to use it:

1. Add jQuery JavaScript library to your webpage.

<script src="jquery.min.js"></script>

2. Add hover in & hover out images as follows:

<img src="1.jpg" data-alt-src="2.jpg">

3. The jQuery script to swap between src and data-alt-src attributes on hover event.

$(document).ready(function(){
  $('img').hover(function(){
    var current = $(this).attr("src");
    var swap = $(this).attr("data-alt-src");
    $(this).attr("src",swap);
    $(this).attr("data-alt-src",current);
  }, function(){
    var current = $(this).attr("src");
    var swap = $(this).attr("data-alt-src");
    $(this).attr("data-alt-src",current);
    $(this).attr("src",swap);
  });
})

---

This awesome jQuery plugin is developed by vhdinh. For more Advanced Usages, please check the demo page or visit the official website.