Question

使用jQuery.ui slidetoggle：

来考虑这个简约的独立示例

<html>
<head>
    <title>Toggle Test</title>
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css"/>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
    <style type="text/css">
    </style>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#fold').click(function () {
                $('.inner').slideToggle(2000);
            });
        });
    </script>
</head>
<body>
<div id="fold">+-</div>
<div class="inner">
    TESTTESTTESTTESTTESTTESTTESTTEST<br/>
    TESTTESTTESTTESTTESTTESTTESTTEST<br/>
    TESTTESTTESTTESTTESTTESTTESTTEST<br/>
    TESTTESTTESTTESTTESTTESTTESTTEST<br/>
</div>
</body>
</html>

预期行为：点击#fold元素将.inner元素折叠为2秒动画（更改高度）。

这是我第一次在Firefox中加载页面时的工作原理。但是，只要我在Firefox中打开Dom-Inspector并选择例如.inner元素，行为就会发生变化：单击将导致在2秒后（如前所述）将元素的显示更改为无，但动画消失。在chrome中，一切都很好。

注1：我正在使用ubuntu代表的FF33.0。尝试使用jsfiddle重现此内容时，请确保右下方Iframe的内容实际显示在DOM-Inspector中。

注2：我正在研究JSON编辑器，并在尝试实现折叠标记时遇到了这个问题。 Firefox中总是缺少切换动画。我希望这个简单问题的解决方案产生一个提示。

jquery ui slidetoggle动画在FireFox中无法正常工作

0 个答案: