社区 学习 工具库 休闲
搜索
简体中文
首页 > web前端 > js教程 > javascript跟随滚动效果插件代码（javascript Follow Plugin）_javascript技巧

javascript跟随滚动效果插件代码（javascript Follow Plugin）_javascript技巧

WBOY
发布： 2016-05-16 17:27:01
原创
1146 人浏览过

Js 跟随滚动效果插件
支持定义多个跟随ID，采用css fixed属性，不支持ie6，兼容其他主流浏览器。
支持定义滚动到底部的最小高度，不会覆盖底部
页面大小resize后，插件会自动重置参数
=======
Js 跟随滚动效果插件
1.支持定义多个跟随ID，采用css fixed属性，不支持ie6，兼容其他主流浏览器。
2.支持定义滚动到底部的最小高度，不会覆盖底部
3.页面大小resize后，插件会自动重置参数
=======
使用方法
 代码如下
 

复制代码 代码如下:

 
window.onload = function(){
 var followIds = [document.getElementById("follow"),document.getElementById("follow2")];
 new Follow({
  obj:followIds,
  bottom:150
 });
}
 

 完整实例
 代码如下
 
复制代码 代码如下:

 



Js Follow



 

 
Header

 

  

   

    使用方法：

    1.载入插件，在页面载入之后，window.onload = function(){}

    2.创建需要跟随的对象的数组，比如 var followIds = [document.getElementById("follow"),document.getElementById("follow2")];

    3.初始化Follow：new Follow();

    4.传参，obj是对象数组，bottom是滚动块距离底部的最小的高度

    

<br><script type="text/javascript" src="follow.js"></script><br>window.onload = function(){<br> var followIds = [document.getElementById("follow"),document.getElementById("follow2")];<br> new Follow({<br>  obj:followIds,<br>  bottom:150<br> });<br>}<br>
登录后复制

   

   









  

  

   

     跟随滚动
模块1
   

   

     跟随滚动
模块2
   

  

 

 
Footer

 


<script><BR>window.onload = function(){<BR> var followIds = [document.getElementById("follow"),document.getElementById("follow2")];<BR> new Follow({<BR> obj:followIds,<BR> bottom:150<BR> });<BR>}<BR></script>


 
相关标签：
插件 滚动 跟随
来源：php.cn
上一篇：jquery的相对父元素和相对文档定位示例代码_jquery 下一篇：jQuery function的正确书写方法_jquery
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
CSS 样式未应用于网站 我正在使用Bootstrap5制作网站，但index.css属性未应用于index.html。当我将鼠标悬停在服务卡上时，背景应该会发生变化，从而产生过渡效果。应该是从这个到这个。...
来自于 2024-04-06 17:12:23
0
1
336
for循环随机从1到0 基本上，每次刷新页面时，for循环都有可能从1变为0。我不知道为什么会发生这种情况，但它影响了我的图像彼此分层的方式。我尝试使用foreach循环，但它仍然给了我相同的结果。这是f...
来自于 2024-04-06 16:48:14
0
1
393
React Three Fiber：为什么我的滚动事件有滞后？ 在ReactThreeFiber中，我有一个React组件，可以生成一个精灵，我希望该精灵在相机变焦下保持不变。该算法似乎有效（大小似乎不随时间变化），但我可以明显看到它在放大和缩...
来自于 2024-04-06 13:39:24
0
1
410
修订后的标题：根据复选框选择计算总计 我正在开发一个简单的财务跟踪应用程序。在应用程序中，有一个包含所有支出账单的表格，然后是位于表格外部的总金额。我正在尝试找到一种使用JS或AJAX的方法，以便当我选择表行中的1个复...
来自于 2024-04-04 13:45:50
0
1
3465
问题仍然是原来的，但标题重写如下：My Javascript random function fails to generate valid responses 我正在使用JS和HTML制作一个简单的随机数生成器游戏。在这个游戏中，您可以设置随机数的最小值和最大值。但是，当设置变量并记录结果时，出现了不可能的数字。例如，如果我将最小值设置为...
来自于 2024-04-03 22:03:14
0
1
275
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板