1

我正在研究 jQuery 和淡入淡出效果。我有以下代码要显示和隐藏带有消息的 div。

`

<script type="text/javascript">
    $(document).ready(function() {

        $("button").click(function() {
            $("#upd").fadeIn(3000);
            $("#upd").fadeOut(20000);
        });

    });
</script>

<style type="text/css">
    div
    {
        background: rgb(237, 243, 254);
        margin: 0px 0px 5px 0px;
        padding: 13px 30px 13px 30px;
        width: 300px;
    }
</style>

`

它在 Internet Explorer 上完美运行，但它在 chrome 中没有做任何事情，我在 Firefox 中得到显示和隐藏行为。

这个库是否有一个特殊的步骤可以在所有浏览器中均匀或至少接近？

4

3 回答 3

7

从fadeIn的回调中尝试fadeOut。这将确保后一个效果在第一个效果完成后运行，而不是在：

$(document).ready(function(){
  $("button").click(function(){
    $("#upd").fadeIn(3000,function(){
      $(this).fadeOut(2500);
    });
  });
});

jQuery本身在所有浏览器中的工作方式应该几乎相同。如果你有奇怪的行为，你可能做错了什么——不是 jQuery :)

于 2009-01-18T00:19:41.210 回答
0

一，确保您使用的是最新的 jQuery，并且在您的所有浏览器中都启用了 Javascript。

其次，尝试将fadeInandfadeOut调用链接在一起：

$("button").click(function() {
    $("#upd")
        .fadeIn(3000)
        .fadeOut(20000);
});
于 2009-01-18T00:24:45.003 回答
0

这是问题： $("button")

没有像按钮这样的元素，如果它是一个类，那么：$('.button')

...如果它是一个 id 然后： $('#button')

于 2010-03-15T17:54:51.660 回答