2

我正在尝试让袋鼠在页面滚动上沿正弦波跳跃,但已经离开学校将近 15 年,无法锻炼实现这一目标所需的数学。我在下面的尝试中已经接近了某个地方,但看起来袋鼠患有癫痫症,并且在整个地方上下跳跃。

这是我的 CSS

.bgRoo{
    position: fixed; 
    background: url(../images/bg-roo.png) no-repeat; 
    width: 225px; height: 239px; 
    left: 50%; margin-left: 250px; 
    border: red; margin-top: 400px;}

和我的 jQuery

$(window).bind('scroll',function(e){
        parallaxScroll();
    });

    function parallaxScroll(){
        var scrolledY = $(window).scrollTop();
        $('.bgRoo').css('top',''+((Math.sin(scrolledY)*30)+(scrolledY*0.1))+'px');
        $('.bgRoo').css('margin-left',(250+scrolledY)+'px')
    }

有人愿意尝试一下吗?

4

1 回答 1

2

这可能是因为它对滚动更改有点敏感......也许Math.sin(scrolledY) 应该是Math.sin(scrolledY/30)左右。传递给 Math.sin 的数字 (scrolledY) 以弧度表示,所以 .... 每 6.28ish 是一个完整的正弦波。意味着目前每 6 像素 ish 它正在经历一个完整的正弦循环,这意味着滚动可能看起来很随机。

于 2012-08-30T02:52:34.890 回答