下面是关于 So 的一个问题的示例,我尝试了以下代码(其中的一部分,而不是全部):
function fadeDivIn(){
$('#helpdocButton').animate({backgroundColor: "#ed3" }, 4000, function(){fadeDivOut();});
}
function fadeDivOut(div){
$('#helpdocButton').animate({backgroundColor: "#3de" }, 4000, function(){fadeDivIn();});
}
$(function() {
$('#helpdocButton').click(function(){
$('menu').hide('slow');
$('helpdoc').show('slow')
});
$('#helpdocButton').mouseover(function(){
fadeDivIn();//it should start the .animate
});
});
我的包括:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
我的风格:
#helpdocButton {
width: 67px;
height: 40px;
background-color: #00ffff;
moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 5px solid #00ffff;
padding: 5px;
opacity: 0.45;
}
#helpdocButton:hover {
-webkit-transition-duration: .90s;
opacity: 2;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
}
那么,为什么动画不起作用?我试图让它从文档加载而不是鼠标悬停开始,但这也不起作用。我还在我的代码中的许多其他 div 上尝试过它。动画不适用于任何东西。其他所有功能都可以正常使用,但 fadeDivIn 功能不起作用。我在这里做错了什么吗?这与我的包含不兼容吗?谢谢。
最佳答案
就像在评论中所说的那样,您使用的是非常旧版本的 jquery 和相当新版本的 jquery ui...我会把钱花在那些不一致的地方..
尝试将您的包含行更新为:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
试一试,如果你需要更多google hosted includes in the future - here is the link
关于javascript - Jquery ui 动画功能不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19280099/