0

按照一个问题的示例,我尝试了以下代码(部分代码,而不是全部代码):

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 功能不起作用。我在这里做错什么了吗?这与我的包含不兼容吗?谢谢你。

4

2 回答 2

0

输入您的 html 代码,然后我可以帮助您:如果有一些错误,我建议您打开 Inspector 元素或萤火虫:我看到一些奇怪的行,您可以更正它们,但它不会解决您的动画问题

$('menu').hide('slow');
$('helpdoc').show('slow')

'menu' 和 'helpdoc' 是什么,如果它们是 html 标签,你可以这样放置(helpdoc html 标签存在?)如果它们是 id 则 $('#menu') & $('#helpdoc'),如果它们是类做 $('.menu') & $('.helpdoc')。然后尝试查看您的 $('#helpdocButton') 元素前面是否还有其他元素并通过悬停和测试替换鼠标悬停。

于 2013-10-09T19:09:06.267 回答
0

就像在评论中所说的那样,您使用的是非常旧版本的 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>

试一试,如果您将来需要更多的谷歌托管包括 - 这是链接

于 2013-10-09T18:56:50.860 回答