求助：如何让页面一打开就可以自己向下滚动（内详）

baggiointer 2013-08-08 03:37:47
1.有一个很长的页面，需要一打开这个页面就自动向下滚动

2.在滚动过程中，用户点击滚动条或其他地方，滚动事件能够马上停止。我的导航条是始终悬浮在屏幕顶部的，锚链接都是链接的这一个页面的不同地方，所以我希望在页面滚动过程中，点击导航链接能跳转过去，或者用户不喜欢页面自己滚动可以自己拖动滚动条去自己想看的地方。我网上找的页面自动滚动的效果，在滚动到页面底部之前，都没办法停下来或点击链接

3.如果可以的话，希望可以在第一次滚动到页面底部之后，能够自动跳转到页面顶部，并不在滚动了（除非刷新），这一条不是很重要，能做到最好，实现不了也没关系


另外还有个小问题，这论坛积分有没有好的办法获得啊？比如购买什么的，我平时比较忙，所以不大经常来论坛赚积分
...全文
694 12 打赏 收藏 转发到动态 举报
写回复
用AI写文章
12 条回复
切换为时间正序
请发表友善的回复…
发表回复
w1016910519 2014-10-21
  • 打赏
  • 举报
 回复
原来如此！------------------------ 回帖就是十积分啊！
baggiointer 2013-08-09
  • 打赏
  • 举报
 回复
引用 9 楼 showbo 的回复:
忘记xhtml了，改成下面的就行了，back或者css1都可以了 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<div style="height:1000px"></div>
<script>
    var timer, scrollHeight, viewHeight, step = 20, sTop = 0,isScrict=document.compatMode=='CSS1Compat';
    document.onclick = function () { clearInterval(timer); }
    function Move() {
        //设置滚动前获取当前的的滚动高度和sTop比较，如果小于sTop或者和sTop的差距大于step定义的，说明拖拽过滚动条了
        var nowScrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
        if (nowScrollTop < sTop || (nowScrollTop - top > step)) clearInterval(timer);
        sTop += step;
        document.documentElement.scrollTop = document.body.scrollTop = sTop;
        if (sTop + viewHeight > scrollHeight) {//滚动到底部
            clearInterval(timer);
            document.documentElement.scrollTop = document.body.scrollTop = 0//跳转到顶部
        }
    }
    window.onresize = function () {
        viewHeight = document[isScrict?'documentElement':'body'].clientHeight;
        scrollHeight = document[isScrict?'documentElement':'body'].scrollHeight;
    }
    window.onload = function () {
        window.onresize();
        timer = setInterval(Move, 100);
    }
</script>
非常感谢，都符合我的要求了，不过我加了一段控制导航浮动的js之后，页面在滚动到最底部之后不会自动返回顶部了，应该是这两段js略有冲突吧？ function tools(){ var top=$(document).scrollTop(); if(($.browser.msie==true)&&($.browser.version==6.0)){ if(top>168)$("#box1_1").css({position:"absolute",top:top-168}); }else{ if(top>168)$("#box1_1").css({position:"fixed",top:0}); } if(top<=168)$("#box1_1").css({position:"static",top:0}); } $(function(){ window.onscroll=tools; window.onresize=tools; }); </script>
斯洛文尼亚旅游 2013-08-09
  • 打赏
  • 举报
 回复
忘记xhtml了，改成下面的就行了，back或者css1都可以了 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<div style="height:1000px"></div>
<script>
    var timer, scrollHeight, viewHeight, step = 20, sTop = 0,isScrict=document.compatMode=='CSS1Compat';
    document.onclick = function () { clearInterval(timer); }
    function Move() {
        //设置滚动前获取当前的的滚动高度和sTop比较，如果小于sTop或者和sTop的差距大于step定义的，说明拖拽过滚动条了
        var nowScrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
        if (nowScrollTop < sTop || (nowScrollTop - top > step)) clearInterval(timer);
        sTop += step;
        document.documentElement.scrollTop = document.body.scrollTop = sTop;
        if (sTop + viewHeight > scrollHeight) {//滚动到底部
            clearInterval(timer);
            document.documentElement.scrollTop = document.body.scrollTop = 0//跳转到顶部
        }
    }
    window.onresize = function () {
        viewHeight = document[isScrict?'documentElement':'body'].clientHeight;
        scrollHeight = document[isScrict?'documentElement':'body'].scrollHeight;
    }
    window.onload = function () {
        window.onresize();
        timer = setInterval(Move, 100);
    }
</script>
baggiointer 2013-08-09
  • 打赏
  • 举报
 回复
引用 7 楼 showbo 的回复:
firefox12，ie7,8，chrome都没有问题，测试过的，你什么浏览器
哦哦，我知道了，你的这段代码如果加上 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> 就不起作用了，能不能让他符合这个标准啊？
斯洛文尼亚旅游 2013-08-09
  • 打赏
  • 举报
 回复
firefox12，ie7,8，chrome都没有问题，测试过的，你什么浏览器
baggiointer 2013-08-09
  • 打赏
  • 举报
 回复
引用 3 楼 showbo 的回复:
<div style="height:1000px"></div>
<script>
    var timer, scrollHeight, viewHeight, step = 20, sTop = 0;
    document.onclick = function () { clearInterval(timer); }
    function Move() {
        //设置滚动前获取当前的的滚动高度和sTop比较，如果小于sTop或者和sTop的差距大于step定义的，说明拖拽过滚动条了
        var nowScrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
        if (nowScrollTop < sTop || (nowScrollTop - top > step)) clearInterval(timer);
        sTop += step;
        document.documentElement.scrollTop = document.body.scrollTop = sTop;
        if (sTop + viewHeight > scrollHeight) {//滚动到底部
            clearInterval(timer);
            document.documentElement.scrollTop = document.body.scrollTop = 0//跳转到顶部
        }
    }
    window.onresize = function () {
        viewHeight = document.body.clientHeight;
        scrollHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);
    }
    window.onload = function () {
        window.onresize();
        timer = setInterval(Move, 100);
    }
</script>
呃，你的这段代码没作用啊
斯洛文尼亚旅游 2013-08-09
  • 打赏
  • 举报
 回复
不要覆盖原来的onresize，改成这样，因为在onload中调用 window.onscroll获取视窗和滚动高作为是否滚动到页脚的代码 
//window.onscroll=tools;
//window.onresize=tools;
//===>
$(window).bind({scroll:tools,resize:tools})
为了那份宁静 2013-08-08
  • 打赏
  • 举报
 回复
斯洛文尼亚旅游 2013-08-08
  • 打赏
  • 举报
 回复
至于论坛积分，你可以联系下管理员看看，换点￥让他们给你充值别。。
斯洛文尼亚旅游 2013-08-08
  • 打赏
  • 举报
 回复 
<div style="height:1000px"></div>

<script>

    var timer, scrollHeight, viewHeight, step = 20, sTop = 0;

    document.onclick = function () { clearInterval(timer); }

    function Move() {

        //设置滚动前获取当前的的滚动高度和sTop比较，如果小于sTop或者和sTop的差距大于step定义的，说明拖拽过滚动条了

        var nowScrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);

        if (nowScrollTop < sTop || (nowScrollTop - top > step)) clearInterval(timer);

        sTop += step;

        document.documentElement.scrollTop = document.body.scrollTop = sTop;

        if (sTop + viewHeight > scrollHeight) {//滚动到底部

            clearInterval(timer);

            document.documentElement.scrollTop = document.body.scrollTop = 0//跳转到顶部

        }

    }

    window.onresize = function () {

        viewHeight = document.body.clientHeight;

        scrollHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);

    }

    window.onload = function () {

        window.onresize();

        timer = setInterval(Move, 100);

    }

</script>
baggiointer 2013-08-08
  • 打赏
  • 举报
 回复
引用 1 楼 showbo 的回复:
每天回个帖就有10分了
时间上没那么充足....
斯洛文尼亚旅游 2013-08-08
  • 打赏
  • 举报
 回复
每天回个帖就有10分了
VIm帮助手册（中文版）
- **滚屏操作**：通过`Ctrl`+`f`、`Ctrl`+`b`等组合键实现页面上下滚动。 - **简单查找**：利用`/`键进行向前搜索，通过`?`键进行向后搜索。 - **模式查找**：介绍更复杂的查找模式，如正则表达式的使用。 - **使用...
vfp6.0系统免费下载
但是，如果在设计时刻 Scrollbars 属性设置为非 0 值，Visual FoxPro 就会允许在运行时刻对 Scrollbars 属性进行读写，因为有代码可调用 SAVEAS() 函数以创建一个带有滚动条的新表单。如果您不需要带滚动条的表单...
Macmini中普通鼠标与TrackPad联动问题解决
我们需要在触控板上“双指”向上拨，页面内容“向上”滚，向下拨，页面内容向下滚。其实在设置中打开鼠标的“自然滚动”功能，就和Windwos系统保持一致了。在Mac系统中，没有好的解决办法了，只有求助第三方软件来...
HTML页面优化与调试实战求助指南
然而，在实际开发中，开发者常面临标签嵌套错误、语义使用不当、样式冲突等问题，导致页面结构混乱、维护困难。因此，掌握HTML页面的优化与调试技巧，是每一位前端开发者进阶的必经之路。本章将围绕HTML优化的核心...
JavaScript

87,995

社区成员

224,693

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章