Question

从几个星期前开始新的Firefox发布之后，我在博客上使用的基于jquery的幻灯片在调用向下滚动页面时开始震动。我首先将jquery脚本从1.7.2升级到1.10.0但没有任何好处，当我向下滚动页面并调用幻灯片时，它激动地开始拍打一秒钟，然后它停在错误的位置，几乎完成了但根本没有。

以下是我正在使用的代码：

$(function() {
    $(window).scroll(function(){
        var distanceTop = $('#last').offset().top - $(window).height();

        if  ($(window).scrollTop() > distanceTop)
            $('#slidebox').animate({'right':'0px'},300);
        else
            $('#slidebox').stop(true).animate({'right':'-430px'},100);
    });

    $('#slidebox .close').bind('click',function(){
        $(this).parent().remove();
    });
});

......这是CSS：

#slidebox{
width:280px;
height:100px;
padding:10px;
background-color:#abc057;
border-top:3px solid #191919;
position:fixed;
bottom:0px;
right:-430px;
-moz-box-shadow:-2px 0px 5px #aaa;
-webkit-box-shadow:-2px 0px 5px #aaa;
box-shadow:-2px 0px 5px #aaa;
}

#slidebox p, a.more{
font-size:11px;
text-transform:uppercase;
font-family: Arial,Helvetica,sans-serif;
letter-spacing:1px;
color:#555;
}
a.more{
cursor:pointer;
color:#E28409;
}
a.more:hover{
text-decoration:underline;
}
#slidebox h2{
color:#E28409;
font-size:18px;
margin:10px 20px 10px 0px;
}

a.close{
background:transparent    url(http://tympanus.net/Tutorials/EndPageSlideOutBox/images/close.gif) no-repeat top left;
width:13px;
height:13px;
position:absolute;
cursor:pointer;
top:10px;
right:10px;
}
a.close:hover{
background-position:0px -13px;
}

有没有人知道如何找出它？

感谢名单！

Answer 1

当您使用右侧参考slidebox动画时，似乎会出现此问题。如果您将代码更改为引用left，则抖动会消失。

jsfiddle

if ($(window).scrollTop() > distanceTop)
    $('#slidebox').animate({'left':'160px'},500);
else
    $('#slidebox').stop(true).animate({'left':'1500px'},500);

当然，您必须更改这些值，使其与您的网页相匹配。

Firefox上的jquery slidebox故障

1 个答案: