jQuery失效
提问于 2014-01-06 04:38:06
当一段文字悬空时，我正试图使一个DIV掉下来。这是最初的效果，这是：
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');
});是我的密码。起初，我认为这是我的图书馆的一个问题，所以我转而使用小提琴的版本。
<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，所以我把它匹配了起来。
#holder {
position: absolute;
top: 200px;
left: 100px;
}
#dropDiv {
display: none;
position: absolute;
top: -20px;
background: #ccc;
}我甚至检查了错误控制台，没有错误，但仍然不能工作。我做错了什么，我该如何解决呢？我正在使用Safari版本5.1.10，并且希望它至少对我和Chrome用户有效。
回答 6
Stack Overflow用户
回答已采纳
发布于 2014-01-06 04:57:40
你的代码在哪里？我也有类似的问题。
<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代码。应该工作的底部标签
还将代码放入就绪函数中。
$(document).ready(function(){
your code here...
})Stack Overflow用户
发布于 2014-01-06 04:40:25
这应该是命令。
<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>Stack Overflow用户
发布于 2014-01-06 04:39:32
试着把代码包装在-
$(document).ready(function() {
//code here
});您的javascript可能不会在加载到DOM的元素之前运行相同的问题。
+
如果您指定的javascript位于fall.js内部，因为它使用jquery，则在jquery之后加载fall.js文件。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20950212
复制相关文章
腾讯云开发者
