下面的基本 jQuery 隐藏/显示代码似乎不适用于带有 Unity 桌面的 Ubuntu 12.04 LTS 上的 Firefox 29.0。完全相同的代码适用于 Chrome 35.0.1916.114。
选择“隐藏此 div”链接时,FF 似乎开始了过渡。使用 Firebug 检查,div 属性从
<div id="togglediv" style="display: block;">
至
<div id="togglediv" style="display: block; overflow: hidden;
height: 88px; padding: 0px; margin: 0px; width: 1422px; opacity: 1;">
但没有进一步的。过渡到“显示:无;” 永远不会发生。不会向 Firebug 控制台抛出任何错误。
我已经查看了数十个 SO 问题,但它们似乎有一些与无持续时间 hide() 相关的不同问题。
如果持续时间被删除或更改为 0,则代码在 FF 和 Chrome 中都有效。为什么非零持续时间会在 FF 中中断?
编辑:更改下面的代码以使用 CDN 版本以便于测试。问题仍然存在。即使升级到最新的 2.1.1 版本。
<html>
<head>
<!-- <script src="/media/js/jquery-1.11.1.js"></script> -->
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<style>
#togglediv {
background: #cccccc;
}
</style>
</head>
<body >
<div style="display: block;" id="togglediv">
<p>jQuery Test</p>
<p><a id="hidelink" href="#">Hide this div</a></p>
</div>
<div id="bringback">
<p><a id="showlink" href="#">Bring it back</a></p>
</div>
<script type="text/javascript" >
// Your code goes here.
$( document ).ready(function() {
$( "#hidelink" ).click(function( event ) {
event.preventDefault();
$( "#togglediv").hide( 500 ); // works in FF if 0 or blank
});
$( "#showlink" ).click(function( event ) {
event.preventDefault();
$( "#togglediv").show( 500 ); // works in FF if 0 or blank
});
});
</script>
</body>
</html>
EDIT2:FF 29.0 在 KDE 平台版本 4.8.5 下的 ubuntu 12.04.4 上似乎没问题。所以,这可能是 Ubuntu Unity 问题,而不是 FF 29.0。