但是滚动条到此处就得停止
简单响应式滚动条置顶 一般的,让页面呈现滚动条的常见要领有: overflow:auto||overflow:scroll 或者overflow-x程度滚动条和overflow-y垂直滚动条 那么此刻要实现这样的一个效果: 直接在body中给一个header,后面一个Group盒子,并且header为常驻顶部的,实现滚动条顶部位置不滚动到header中(包罗在header中会影响美不雅观)
首先看例子:
每当滚动条移动到header的高度的位置时,这时盒子中的前排内容是并没有显示出来的,,但是滚动条到此处就得遏制。那么盒子首先就需要设置一个margin-top:header的高 ,和定位top的值 ,在js中也要控制scrollTop值,通过判断滚动条移动到容器顶部时固定
header{position: fixed;top: 0;left: 0;right: 0;z-index: 999;} #con{margin-top: 150px;position: absolute;top:50px;}最终效果:
js获取屏幕滚动条:document.documentElement.scrollTop || document.body.scrollTop
html简单响应式滚动条置顶
温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/31449.html
- 上一篇:jquery ,页面倒计时
- 下一篇:最初的 jQuery 版本无法满足需求