知识大全 javascript跟随滚动效果插件代码

Posted 2022-07-14 知

篇首语：不塞不流，不止不行。本文由小常识网(cha138.com)小编为大家整理，主要介绍了知识大全 javascript跟随滚动效果插件代码相关的知识，希望对你有一定的参考价值。

　　Javascript Follow Plugin

　　Js 跟随滚动效果插件

　　支持定义多个跟随ID 采用css fixed属性不支持ie 兼容其他主流浏览器

　　支持定义滚动到底部的最小高度不会覆蓋底部

　　页面大小resize后插件会自动重置参数

　　======= Js 跟随滚动效果插件

　　支持定义多个跟随ID 采用css fixed属性不支持ie 兼容其他主流浏览器支持定义滚动到底部的最小高度不会覆蓋底部页面大小resize后插件会自动重置参数 =======

　　使用方法

代码如下

　　window onload = function() var followIds = [document getElementById("follow") document getElementById("follow ")]; new Follow( obj:followIds bottom: );

　　完整实例

代码如下

　　 <!DOCTYPE > < lang="zh CN"> <head profile=" <meta charset=UTF > <title>Js Follow</title> <style> bodywidth: %;margin: ;padding: ; divpadding: ;margin: ;text align:center;font size: px;font weight:bold;color:#fff; clear:aftercontent:"";display:block;height: ;clear:both;visibility: hidden;overflow:hidden; clear*zoom: ;

　　 wrapwidth: px;margin: auto; headerwidth: %;background:# BA E ;height: px;line height: px; footerwidth: %;background:# ;height: px;line height: px; contentwidth: %;margin: auto;background:#aaa; leftwidth: %;float:left;background:# CBF ; textpadding: px;text align:left;word break:break all;line height: px;font size: px;font weight:normal; rightwidth: %;float:left; asidepadding: px px;margin top: px;background:#F ;width: px;height: px; aside padding: px px;background:#DB F ; </style> </head> <body> <div > <div >Header</div> <div > <div > <div > 使用方法 <br/> 载入插件在页面载入之后 window onload = function()<br/> 创建需要跟随的对象的数组比如 var followIds = [document getElementById("follow") document getElementById("follow ")];<br/> 初始化Follow new Follow();<br/> 传参 obj是对象数组 bottom是滚动块距离底部的最小的高度<br/> <hr/> <pre > <script type=text/javascript src=follow js></script>

　　window onload = function() var followIds = [document getElementById("follow") document getElementById("follow ")]; new Follow( obj:followIds bottom: );

　　</pre> </div> <br/><br/><br/><br/><br/><br/><br/><br/><br/> </div> <div > <div id="follow"> 跟随滚动<br/>模块 </div> <div id="follow "> 跟随滚动<br/>模块 </div> </div> </div> <div >Footer</div> </div>

cha138/Article/program/Java/JSP/201311/20534