0

我是 JQuery 的新手，我想弄清楚如何让我的 .mouseenter() 和 .mouseleave() 方法工作。到目前为止，我已经尝试过使用 IE8 和 FF，但由于某些奇怪的原因，除了保持静态之外，我无法让我的元素做任何事情。这是我到目前为止的代码：

HTML：

<!Doctype html>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="style.css"/>
        <script type="text/javascript" src="file:///D:/Documents%20and%20Settings/stsc/My%20Documents/_prac/script.js"></script>
        <title>Practice</title>
    </head>
    <body>
        <div id="red"></div>
        <div id="yellow"></div>
        <div id="green"></div>
    </body>
</html>

CSS：

div{
    height:100px;
    width: 100px;
    border-radius: 50px;
}

#red{
    background-color: red;
}

#yellow{
    background-color: yellow;
}

#green{
    background-color: green;
}

JS：

$(document).ready(function(){
    $('div').mouseenter(function(){
        $(this).animate({
            width: '+=10px'
        });
    });
    $('div').mouseleave(function(){
        $(this).animate({
            width: '-=10px'
        });
    });
    $('div').click(function() {
        $(this).toggle(1000);
    });
});

这只是一个练习使用 JQuery 的简单示例。提前感谢您的帮助！

4

2 回答 2

2

你似乎没有包括 jQuery：

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

另外，D:\ 驱动器是硬盘驱动器还是 CD/DVD 驱动器？这也可能是一个问题。

于 2013-04-24T23:12:22.463 回答
1

您应该在 HTML 中引用 jquery 库：

<head>
    <link type="text/css" rel="stylesheet" href="style.css"/>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="file:///D:/Documents%20and%20Settings/stsc/My%20Documents/_prac/script.js"></script>
    <title>Practice</title>
</head>
于 2013-04-24T23:12:50.793 回答