停止滚动页面，滚动DIV

我创建这个着陆页：http://tag4share.com/landing/#停止滚动页面，滚动DIV

凡位于两个星系S3（一个白色的，上面有“Organizador”标签和一个黑色的“PARTICIPANTE”标签），我想停止滚动页面并自动开始滚动移动内容（一个iFrame，div，任何东西）。

可能吗？

基本上我想“关注”div内的滚动（即使光标没有悬停它也能使其工作）。或滚动时滚动身体不动。

例子：http://www.google.com/nexus/5/

在“你需要捕捉每个重要时刻的一切。”部分。

我尝试：

var lastScroll; 
var currentScroll = $(window).scrollTop(); 

$(window).scroll(function() { 

    lastScroll = currentScroll; 
    currentScroll = $(window).scrollTop(); 

    if($(window).scrollTop() >= 2024 && $(window).scrollTop() < 2500) 
    { 
       var difference = currentScroll - lastScroll; 
     $(".main").css({"margin-top":"-="+currentScroll}); 
    } 
    });

我试着用滚动一起移动的主要股利。它的工作原理，但它看起来很奇怪（不停颤抖）。

谢谢！

来源

2013-11-03 Maurício Giordano

您的问题听起来类似于此：http://stackoverflow.com/questions/9328273/lock-mousewheel-scroll-to-focus-div – Cosades

当然，你不希望人们为你写代码，必须试过什么？你可以用$（'window'）来检测窗口的滚动，on（'scroll'，function（）{}）;'，然后你可以不断地将浏览器重新定位到顶部并滚动div来计算用户已滚动。 –

编辑帖子。 –

我刚刚收拾你的代码一点点，固定压痕等

至于实际滚动的DIV，当你打的位置，使用animate实际上模仿scrolling效果，一旦你知道你已经达到在底部，您可以在滚动功能中添加另一个if语句以停止重置滚动位置。

var lastScroll; 
var scrollPosition = $(window).scrollTop(); 
var reachedBottom = false; 
var phonePositionTop = $('#phoneContainerID').position().top; 
var phonePositionBottom = phonePositionTop + $('#phoneContainerID').height(); 

$(window).scroll(function() { 

    if(scrollPosition >= phonePositionTop && scrollPosition < phonePositionBottom && reachedBottom == false){ 
     var difference = currentScroll - lastScroll; 
     // Keep resetting scroll to the phoneContainerTop position 
     $(".main").css({"margin-top": phonePositionTop}); 
     var scrollLimit = -100; 
     if ($('#phoneContainerID').position().top < scrollLimit) { 
      //Once the scroll limit is less than -100 (scrolled up 100 pixels) 
      // Disable our 'pause' effect, and continue 
      reachedBottom = true; 
     } 

    } 
});

我还没有测试过这个，但是我只是给你一个从这里出发的想法。

我希望我帮了一点点！

来源

2013-11-03 22:38:55

停止滚动页面，滚动DIV

回答

相关问题