为什么这个jquery效果不起作用?

时间:2015-03-21 11:31:35

标签: javascript jquery

我正在使用Codecademy的这个课程,一旦我完成并运行代码..它工作得很好,但我喜欢做的是从codecademy获取代码并将其复制/粘贴到我自己的jquery文件夹中参考/实践。

这个项目的目标是让氪在500毫秒内反弹3次,而script.js在codecademy中工作,但是当我在本地设置时却没有。有人知道为什么吗?

的index.html:

<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/main" href="main.css">
</head>
<body>

<div></div>


<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script src="script.js"></script>   
</body>
</html>

的main.css:

body {
background-image: url('http://bit.ly/UpQgJ6');

}

div {
    height: 100px;
    width: 100px;
    border-radius: 100%;
    background-color: #008800;
    background-image: -webkit-gradient(linear, 100% 0%, 0% 100%, from(#003500), to(#008800));
    background-image: -webkit-linear-gradient(left, #003500, #008800); 
    background-image:    -moz-linear-gradient(left, #003500, #008800);
    background-image:     -ms-linear-gradient(left, #003500, #008800);
    background-image:      -o-linear-gradient(left, #003500, #008800);
}

的script.js:

$(document).ready(function() {
    $('div').click(function() {
        $(this).effect('bounce', {times:3}, 500);
    }); 
});

感谢您阅读

1 个答案:

答案 0 :(得分:1)

您似乎没有包含jquery核心库。 Jquery UI因为依赖于jquery核心而无法工作。把它放在jquery ui脚本代码上面

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

或者您可以更改版本本身。在这里看到所有版本包括:

https://developers.google.com/speed/libraries/devguide#jquery