Question

我已经设置了一个滚动网站（基本上是一个视差风格的页面，没有视差效果），其中每个“页面”只是一个占据屏幕100％的div。但我需要某种机制来将滚动“锁定”到正确的位置，以便div与用户的浏览器正确对齐。

如果您需要一个示例，Flickr的启动页面可以完美地完成此操作。

感谢。

编辑：这是我正在处理的网站的链接。代码有点混乱，有些图像没有加载（因为它们还没有托管），但它可以让你大致了解网站的运作方式。 http://fiddle.jshell.net/99QjJ/

Answer 1

我刚刚尝试构建一个快速解决方案：Fiddle

它会阻止正常滚动并滚动到div的适当偏移量：

if(!scrolling) {
    scrolling = true;
    currentDiv = (scrollDirection == "down" ? currentDiv + 1 : currentDiv - 1)
    $("html,body").animate({
        "scrollTop":offsets[currentDiv]
    },{queue:true,duration:1000,complete:function() {
        window.setTimeout(function() {
             scrolling = false;
         },200);
    }});

它没有完整的解决方案，但我认为这会奏效。另一个想法是使用数千个jQuery插件中的一个，这些插件通过箭头键可以滚动页面。我认为如果每个div都符合整个屏幕尺寸，那么就没有实际需要滚动＆＃34;介于＆＃34;之间。

Answer 2

所以你要做一个页面＆＃39;网站，对吗？你不能在你想跳到的每个元素上使用锚标记吗？

您可以使用this漂亮的jQuery插件

为其设置动画效果

如何锁定＆＃39;滚动到div？

2 个答案: