2014-11-02 1 views
0

Я пытаюсь изменить изображение с помощью мыши, но он, похоже, не работает? может ли кто-нибудь помочь? Вот мой кодJavaScript MouseOver Image

<img id="myImg" src="Nov1.jpg" alt="November" style="width:452px;height:127px"> 

    <script> 
    $('#myImg').hover(function() { 
    $(this).attr('src', '/folder/nov2014.jpg'); 
    }, function() { 
    $(this).attr('src', '/folder/Nov1.jpg'); 
    }); 


    </script> 
+0

«/» в первой позиции означает корень системы. Используйте относительные способы. Кроме того, попробуйте использовать не 'hover', а' mouseover' и 'mouseout' – rberla

+0

Кроме того, когда вы обрабатываете' mouseout', вы меняете 'src' изображения не обратно на« Nov1.jpg », а на '/ folder/Nov1 .jpg ' – rberla

ответ

-1

Try:

<img id="myImg" src="Nov1.jpg" alt="November" style="width:452px;height:127px"> 

    <script> 

    $("#myImg") 
      .mouseover(function() { 
       $(this).attr("src", "/folder/nov2014.jpg"); 
      }) 
      .mouseout(function() { 
       $(this).attr("src", "/folder/Nov1.jpg"); 
      }); 
    </script> 
+0

Извините, я допустил ошибку в своем редактировании. Эта версия должна работать. –

0

Там могут быть две причины, которые могут создать такую ​​проблему.

  1. Смотрите, если вы включили библиотеку JQuery перед его использованием.
  2. Вы должны поместить ваш код внутри $ (документ) .ready (функция() { // здесь код идет });

Попробуйте этот путь,

HTML:

<img id="myImg" src="http://www.allgraphics123.com/ag/01/14142/14142.gif" /> 

JQuery:

$(document).ready(function(){ 
    $('#myImg').hover(function() { 
     $(this).attr('src', 'http://thumb7.shutterstock.com/display_pic_with_logo/265489/120305665/stock-vector-cartoon-parrot-vector-clip-art-illustration-with-simple-gradients-all-in-a-single-layer-120305665.jpg'); 
     }, function() { 
     $(this).attr('src', 'http://www.allgraphics123.com/ag/01/14142/14142.gif'); 
    }); 
}); 

jsFiddle

Почему ваш код не работает ?????

Перед использованием любого элемента DOM сначала необходимо загрузить страницу. Поэтому возникает один вопрос:

Как я узнаю, что страница уже загружена !!!

Входит $ (document) .ready(); в качестве помощи от jQuery. Он позволяет javaScript выполнять код, который он содержит, когда элементы DOM готовы к использованию. Так как разработчику вам не нужно беспокоиться, загружен ли DOM или нет.

И вот почему вы собираетесь манипулировать элементом DOM #myImg, прежде чем он будет доступен для использования. И ваш код javaScript/jQuery не смог найти, о чем вы просите.

I just rephrased this documentation:Here