Question

最近我开始使用HTML5，CSS3和JScript构建个人网站。我对此感到非常有趣，我认为我可以做任何事情而没有任何问题，但我错了所以我在这里。

我的查询是：当用户向下/向下滚动时，如何将用户重定向到外部页面？

我已经在网上找到了，我找到了很好的答案，但没有一个能帮助我。大部分答案都是使用window.location.replace("http://stackoverflow.com");解释的或类似的东西，但我正在寻找其他东西。

我也尝试过查看Jquery文档，但我找不到有关滚动的内容。

=============================================== ==========================

修改

基本上我有一个完整的宽度和长度页面，我想要的是当用户向下滚动鼠标时我想从主页重定向到关于。 WebPage

我尝试了迄今为止给出的解决方案但没有任何反应！没有错误，什么都没有。

谢谢您的时间！

Answer 1

要在用户滚动到页面底部时重定向，您可以挂钩滚动事件，然后在窗口高度加上窗口顶部位置等于文档总高度时触发重定向。

使用jQuery看起来像这样：

$(window).scroll(function() {
    if($(window).scrollTop() + $(window).height() == $(document).height()) {
       window.location.replace("http://stackoverflow.com");
    }
});

This answer提供了有关拾取滚动事件和使用jQuery自定义该行为的更多信息。

<强>更新

JSFiddle here

上面的代码可能无法在JSFiddle或类似的stackoverflow.com中将X-Frame-Options响应标头设置为SAMEORIGIN。如果从HTTPS重定向到HTTP，您也可能在某些浏览器中遇到问题。上面链接的JSFiddle演示了一个工作实现，重定向到另一个JSFiddle页面以避免X-Frame-Options问题。

Answer 2

它也适用于动态创建的内容

var lastScroll = 0;
$(document).on( 'scroll', '#ScrollContainer', function(){
    //console.log('Event fired');

   var st = $(this).scrollTop();
   if (st > lastScroll){
       window.loaction.href = "www.google.com"
   }

   lastScroll = st;
});

如何在滚动时将用户重定向到外部页面？

2 个答案: