当前位置：首页 > 资讯 > 技术文档

xScrollStick 跟随滚动条漂浮的JS特效

时间：2021-03-22 11:40 编辑：来源：阅读：
扫一扫，手机访问

摘要：xScrollStick 跟随滚动条漂浮的JS特效

这是一个跟随滚动条漂浮的JS特效，就是说滚动条滚动而元素相对屏幕位置不变网上有很多类似的效果，本代码比较起来有如下优点： 1. 兼容IE6.0+ & FF1.5+ 2. 使用非常简单，属于菜鸟最爱的那种拿来就能用的，见下面说明 3. 元素之间不会起冲突，一页中可以有n个特效，多元素使用无代码冗余缺点有： 1. 只能在声明为xHTML的文档中使用 2. 元素最好放在body下 3. 滚动时不可避免的会有闪烁（已经比较轻微，但追求完美者可能觉得不爽）使用说明：在页面中引用JS包，然后在需要特效的div上设定class为xScrollStick即可，当然不要忘记给每个元素写上你希望它固定的位置示例1：

[url=http://www.163.com]俺是浮动条[/url]

俺是浮动条2

俺是浮动条3

俺是浮动条4

afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg afosdhfosdhg

[Ctrl+A 全选注:[url=http://www.1sucai.cn/article/23421.htm]如需引入外部Js需刷新才能执行[/url]]

页面由两个个部分组成：页面文件：代码拷贝框

[url=http://www.163.com]</div> <div class="xScrollStick d2">俺是浮动条2</div> <div class="xScrollStick d3">俺是浮动条3</div> <div class="xScrollStick d4">俺是浮动条4</div> <div style="top:0px;width:400px;height:2000px;"> afosdhfosdhg<br> afosdhfosdhg<br>afosdhfosdhg<br> afosdhfosdhg<br>afosdhfosdhg<br> afosdhfosdhg<br>afosdhfosdhg<br> afosdhfosdhg<br>afosdhfosdhg<br> afosdhfosdhg<br>afosdhfosdhg<br> afosdhfosdhg<br> </div> </body> </html>

js：运行代码框

[Ctrl+A 全选注:[url=http://www.1sucai.cn/article/23421.htm]如需引入外部Js需刷新才能执行[/url]]

ps: 这一作的技术含量较前两个更低......没办法，JS本来的目的之一就是特效....

全部评论(0)

上一篇：js实现获取焦点后光标在字符串后
下一篇：javascript实现密码强度显示

资讯排行榜
更多>>