首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >jQuery失效

jQuery失效
EN

Stack Overflow用户
提问于 2014-01-06 12:38:06
回答 6查看 149关注 0票数 0

当一段文字悬空时,我正试图使一个DIV掉下来。是最初的效果,这是:

代码语言:javascript
代码运行次数:0
运行
复制
var $dropDiv = $('#dropDiv');
$('#holder p').on('hover', function () {
    // Get position of clicked div
    var offset = $(this).offset();

    // Get dimensions of said div
    var h = $(this).outerHeight();
    var w = $(this).outerWidth();

    // Get dimensions of dropping div
    var dh = $dropDiv.outerHeight();
    var dw = $dropDiv.outerWidth();

    // Determine middle position
    var initLeft = offset.left + ((w / 2) - (dw / 2));

    // Animate drop
    $dropDiv.css({
        left: initLeft,
        top: $(window).scrollTop() - dh,
        opacity: 0,
        display: 'block'
    }).animate({
        left: initLeft,
        top: offset.top - dh,
        opacity: 1
    }, 800, 'easeOutBounce');
});

是我的密码。起初,我认为这是我的图书馆的一个问题,所以我转而使用小提琴的版本。

代码语言:javascript
代码运行次数:0
运行
复制
<script src="fall.js"></script>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>

小提琴也有一些CSS,所以我把它匹配了起来。

代码语言:javascript
代码运行次数:0
运行
复制
#holder {
    position: absolute;
    top: 200px;
    left: 100px;   
}
#dropDiv {
    display: none;
    position: absolute;
    top: -20px;
    background: #ccc; 
}

我甚至检查了错误控制台,没有错误,但仍然不能工作。我做错了什么,我该如何解决呢?我正在使用Safari版本5.1.10,并且希望它至少对我和Chrome用户有效。

EN

回答 6

Stack Overflow用户

回答已采纳

发布于 2014-01-06 12:57:40

你的代码在哪里?我也有类似的问题。

代码语言:javascript
代码运行次数:0
运行
复制
<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    </head>
    <body>
      YOUR HTML CODE
     <script type="text/javascript"> your code</script>
     or
     <script src="fall.js"></script>
    </body>
</html>

在html代码之后包括您的jQuery代码。应该工作的底部标签

还将代码放入就绪函数中。

代码语言:javascript
代码运行次数:0
运行
复制
$(document).ready(function(){
    your code here...
})
票数 0
EN

Stack Overflow用户

发布于 2014-01-06 12:40:25

这应该是命令。

代码语言:javascript
代码运行次数:0
运行
复制
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script src="fall.js"></script>
票数 6
EN

Stack Overflow用户

发布于 2014-01-06 12:39:32

试着把代码包装在-

代码语言:javascript
代码运行次数:0
运行
复制
$(document).ready(function() {

 //code here

});

您的javascript可能不会在加载到DOM的元素之前运行相同的问题。

+

如果您指定的javascript位于fall.js内部,因为它使用jquery,则在jquery之后加载fall.js文件。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/20950212

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档