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

标签 javascript jquery

我正在 Codecademy 上完成这门类(class),一旦我完成并运行了代码..它工作得很好,但我喜欢做的是从 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);
}

脚本.js:

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

感谢您的阅读

最佳答案

您似乎没有包含 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

关于javascript - 为什么这个jquery效果不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29182220/

相关文章:

javascript - JQuery:隐藏除一个图像之外的所有图像,从第一个开始并滚动它

php - Yii 自定义小部件

javascript - 解除绑定(bind)涉及从 DOM 中删除 jquery 的点击事件

javascript - 判断父容器子元素是否包含特定类并执行某些操作的条件

java - 如何在用户端从 Spring response.sendError(...) 检索描述性消息?

JavaScript 错误,战舰游戏

javascript - AngularJS - 无法在 'animate' : Partial keyframes are not supported 上执行 'Element'

JavaScript优化: Caching math functions globally

javascript - jQuery ajax 请求和内联 javascript

javascript - 动态添加数字进行选择