2013-12-22 62 views
1

我得到這段代碼是爲了測試目的,它非常簡單,當我在Firefox中打開它進行調試時,它不工作,一切似乎都被加載並罰款,這很奇怪,對此有何想法? 。非常感謝jQuery不適用於fadeOut

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <title>Hover Over effect jQuery</title> 
 
    <link rel="stylesheet" href="css/style.css"> 
 
    <script type="text/javscript" src="js/jquery-1.10.2.min.js"> 
 
     jQuery(document).ready(function($) { 
 
     $("img").click(function(event) { 
 
      $(this).fadeOut('slow'); 
 
     }); 
 
     }); 
 
    </script> 
 
    </head> 
 
    <body> 
 
    <div class="viewport"> 
 
     <a href="#"> 
 
     <img src="images/renew.jpg"> 
 
     </a> 
 

 
     <div class="caption"><span>Caption goes here</span> 
 
     </div> 
 
    </div> 
 
    </body> 
 
</html>

+0

爲什麼你有2個''標記? –

+3

你不應該把它放在'

1

代碼不工作有兩個問題。

  1. 當您嘗試使用src屬性加載外部腳本時,它將忽略腳本標記的內容。只需包括<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> :)。
  2. 當您創建腳本元素時,拼寫錯誤JavaScript。修正拼寫錯誤,並在您正確包含jQuery庫後修復代碼。

一對夫婦更有用的提示:

  • 確保你的HTML標籤是在正確的位置。在你的代碼中,你已經聲明瞭兩次html標籤。確保頂部有一個<html>,末尾有一個結束標記</html>

  • <!DOCTYPE>聲明位於文檔的最頂端。

使用示例代碼:

<!DOCTYPE html> 
<html> 

<head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <title>Hover Over effect jQuery</title> 
     <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
     <script type="text/javascript"> 

      jQuery(document).ready(function($) { 
       $("img").click(function(event) { 
        $(this).fadeOut('slow'); 
       }); 
      }); 

      </script> 


</head> 
<body> 
    <div class="viewport"><a href="#"> 
    <img src="robin.gif" ></a> 

    <div class="caption"><span>Caption goes here</span></div></div> 
</body> 
</html> 

我希望這有助於!