Question

我尝试在我的网站上为按钮制作一个小脚本，但它在任何浏览器中都不起作用。

我不明白为什么它不起作用。你们可以看看它，看看有什么不对。

这是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);
    });

});

提前致谢!!

Answer 1

您需要在页面中加入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>

注意，上面的例子是使用谷歌CDN的jQuery 1.10.2副本。如果需要，您可以将其修改为其他版本。

简单的按钮javascript代码在任何浏览器中都不起作用

1 个答案: