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

标签 javascript jquery html css

最近我开始使用 HTML5、CSS3 和 JScript 构建个人网站。我从中获得了很多乐趣,我认为我可以毫无问题地完成所有事情,但我错了,所以我来到了这里。

我的问题是:当用户向下/向下滚动时,如何将用户重定向到外部页面?

我已经在网上搜索过,我找到了很好的答案,但没有一个对我有帮助。大多数答案都解释了使用 window.location.replace("http://stackoverflow.com"); 或类似的东西,但我正在寻找别的东西。

我也尝试查看 Jquery 文档,但没有找到任何关于滚动的信息。

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

编辑

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

我尝试了目前给出的解决方案,但没有任何反应!没有错误,什么都没有。

谢谢您的宝贵时间!

最佳答案

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

使用 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 响应 header 设置为 SAMEORIGIN。如果从 HTTPS 重定向到 HTTP,您也可能在某些浏览器中遇到问题。上面链接的 JSFiddle 演示了一个有效的实现,重定向到另一个 JSFiddle 页面以避免 X-Frame-Options 问题。

关于javascript - 如何在滚动时将用户重定向到外部页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42737589/

相关文章:

html - 按百分比设置填充时垂直菜单转到新行

javascript - 找不到重构警报的方法(练习)

javascript - jPlayer - 通过 Javascript 实现倒带功能

javascript - 带有 css3 和 html5 的简单窗口系统渲染缓慢。如何加快速度?

javascript - 翻转的卡片不会在第二个动画中保留后部 div

html - Bootstrap 网格空白空间

javascript - 为什么 URL 未定义(在 JQuery Ajax 发布之后)

javascript - 计算输入字段中的字符数,然后提交

javascript - Angular 2 中的动态模板 URL

html - Wordpress 自定义菜单图像和样式