按鈕的簡單JavaScript代碼在任何瀏覽器中都不起作用

我試圖爲我的網站上的按鈕製作一個小腳本，但它在任何瀏覽器中都不起作用。按鈕的簡單JavaScript代碼在任何瀏覽器中都不起作用

我不明白爲什麼它不起作用。你們可以看看它，看看有什麼不對。

這是HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Button Magic</title> 
     <link rel='stylesheet' type='text/css' href='stylesheet.css'/> 
     <script type="text/javascript" src="script.js"></script> 
    </head> 
    <body> 
    <div><br/><strong>Click Me!</strong></div> 
    </body> 
</html>

這是CSS：

div { 
    height: 60px; 
    width: 100px; 
    border-radius: 5px; 
    background-color: #69D2E7; 
    text-align: center; 
    color: #FFFFFF; 
    font-family: Verdana, Arial, Sans-Serif; 
    opacity: 0.25; 
}

這是JavaScript：

$(document).ready(function(){ 
    $('div').mouseenter(function() { 
     $('div').fadeTo('slow', 1); 
    }); 

    $('div').mouseleave(function() { 
     $('div').fadeTo('slow', 0.25); 
    }); 

});

在此先感謝！

來源

2013-11-23 user3024879

您需要將jquery.js添加到您的頁面。

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Button Magic</title> 
     <link rel='stylesheet' type='text/css' href='stylesheet.css'/> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
     <script type="text/javascript" src="script.js"></script> 
    </head> 
    <body> 
    <div><br/><strong>Click Me!</strong></div> 
    </body> 
</html>

請注意，上面的示例使用了Google CDN中的jQuery 1.10.2副本。如果需要，您可以將其修改爲不同的版本。

來源

2013-11-23 12:56:15

非常感謝羅伊！ – user3024879

我如何知道我必須使用哪個版本？ – user3024879

除非您有一些您需要支持的特定功能，否則您應該始終使用最新版本。 –

按鈕的簡單JavaScript代碼在任何瀏覽器中都不起作用

回答

相關問題