JavaScript MouseOver Image

我想通過使用鼠標懸停更改圖片，但它似乎並沒有工作？誰能幫忙？這裏是我的代碼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>

來源

2014-11-02 121910

'/'在第一個位置意味着系統的根。使用相對的方式。此外，嘗試使用不是'hover'，而是'mouseover'和'mouseout' – rberla 2014-11-02 18:29:06

另外，當你處理'mouseout'時，你改變'src'圖像不會回到「Nov1.jpg」，而是到'/ folder/Nov1 .jpg' – rberla 2014-11-02 18:35:28

-1

嘗試：

<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>

來源

2014-11-02 18:33:13

對不起，我在編輯時犯了一個錯誤。這個版本應該工作。 – 2014-11-02 18:40:40

有可能是可以創造這樣的問題有兩個原因。

見，如果你已經在使用它之前包括jQuery的庫。
你必須把你的代碼內$（文件）。就緒（函數（）{//這裏對您的代碼放在}）;

嘗試這種方式，

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元素之前，頁面必須首先加載。所以有一個問題出現，

我怎麼知道，如果該頁面已被加載！

Here is comes $（document）.ready（）;作爲jQuery的助手。它允許javaScript在DOM元素準備好使用時執行它包含的代碼。所以作爲一名開發人員，您不必擔心DOM是否已加載。

這就是在DOM元素#myImg可用之前操縱DOM元素的原因。而你的javaScript/jQuery代碼找不到你所要求的。

I just rephrased this documentation:Here

來源

2014-11-02 18:51:39

JavaScript MouseOver Image

回答

相關問題