Question

正如标题中所提到的，https://onlycoin.com/具有平滑的鼠标滚动效果，当我们滚动时，这些卡片会动画化。

我想要实现类似的东西。我已经制作了网页。而不是卡片，我有移动电话，将动画。

任何人都可以帮助我如何继续这样做吗？

我已经在页面上完成了HTML编码，我真的很困惑于jquery.animate（）;功能

因此，我所知道的唯一参考站点是我上面发布的站点。

我是jquery的新手。谢谢你的帮助。

Answer 1

很难为您提供完整的解释，但我将它们放在一起让您入门：

http://jsfiddle.net/Ms7gw/

HTML

<div id="container">
<div class="box" id="right"></div>
<div class="box" id="center"></div>
<div class="box" id="left"></div>
</div>

CSS

#container {height: 1000px; width: 1000px; background-color: #000;}
.box {width: 100px; height: 100px; position: absolute; left: 50%; top: 50%; margin-left: -50px; margin-top: -50px; background-color: #ff0000;}
#right {background-color: #aa0000;}
#left {background-color: #aa0000;}

JS

var lastScrollTop = 0;
var leftBox = $('#left').position();
var rightBox = $('#right').position();

$(window).scroll(function(event){
    var st = $(this).scrollTop();
    $('#right').css({left: rightBox.left + st});
    $('#left').css({left: leftBox.left - st});
    lastScrollTop = st;
});

我希望有一个类似于网站https://onlycoin.com/的jQuery鼠标滚动动画效果

1 个答案: