جافا سكربت تغير الصورة عن المرور عليها

الكود:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<img src="http://dummyimage.com/100x100/000000/ffffff&text=Image+1"
       data-hover="http://dummyimage.com/100x100/ffffff/000000&text=Image+2"
       data-out="http://dummyimage.com/100x100/000000/ffffff&text=Image+1" />


كود الجافا سكربت

الكود:

  $('img').on('mouseover',function () {
        var data = $(this).attr('data-hover');
        $(this).attr("src", data); // data-hover
    })
    $('img').on('mouseout', function() {
        var data = $(this).attr('data-out');
        $(this).attr("src", data); // data-out
    });

 لتغير الصورة الأولى ابحث على http://dummyimage.com/100x100/000000/ffffff&text=Image+1 
 لتغير رابط الصورة الثانية  http://dummyimage.com/100x100/ffffff/000000&text=Image+2