-
- qq_杰哥_2 2021-06-26
原生写法
- 0赞 · 0采集
-
- _OuYanG 2020-02-05
js原生写法
-
截图0赞 · 0采集
-
- _OuYanG 2020-02-05
封装获取id，和绑定时间+兼容
-
截图0赞 · 0采集
-
- _OuYanG 2020-02-05
JQ的方法
-
截图0赞 · 0采集
-
- iFlowers 2019-01-15
避免浏览器bug
-
截图0赞 · 0采集
-
- 慕的地6475653 2018-12-02
- 封装动引用
-
截图0赞 · 0采集
-
- qq_猫言深林_rAEM47 2018-11-08
- 前端
-
截图0赞 · 0采集
-
- 哈尔波儿 2018-08-07
1、固定右侧边栏实现关键点：
① CSS position fixed属性
② 监听window上的滚动事件
③ 右侧边栏设置fixed条件判断：滚动高度 + 屏幕高度 > 右侧边栏高度
2、使用jQuery为我们部署在服务器上的地址： <script src="https://code.jquery.com/jquery.js"></script>
3、① 多次用到的对象最好事先定义在一个变量里：var jWindow = $(window);//获取window对象
② jWindow.scroll(function(){ }//给window对象绑定滚动事件
③ var scrollHeight=jWindow.scrollTop();//窗口滚动的高度
④ var screenHeight=jWindow.height();//屏幕可视区域的高度
⑤ var sideHeight=$('#side').height();//右侧边栏的高度
4、部分关键代码： if(scrollHeight+screenHeight>sideHeight){ $('#side').css({ 'top':-(sideHeight-screenHeight),//如果设成'top':0,就会跳到右侧边栏的最顶端 'right':0 }); }else{ $('#side').css({ 'position':'static';//position的默认取值是static }); }
部分关键代码： window.onload=function (){ jWindow.trigger('scroll');//触发window滚动的事件 }; jWindow.resize(function (){ jWindow.trigger('scroll'); });
- 1赞 · 3采集
-
- qq_下雨天_19 2017-10-13
- 1.封装 取id 2.封装浏览器兼容
-
截图0赞 · 0采集
-
- riyyao 2017-08-01
- var windowHeight = $(window).scrollTop() + $(window).height(); //窗口滚动高度+屏幕可视高度
- 0赞 · 0采集
-
- riyyao 2017-08-01
- 固定边栏滚动特性
-
截图0赞 · 1采集
-
- 慕侠0422420 2017-07-27
- 固定边栏滚动特性
-
截图0赞 · 0采集
-
- q_Amily 2017-06-06
- 发现js中的cssText它的作用的替换，显然，当滚动高度+浏览器可见高度大于侧边栏高度时，案例中用了cssText="position:fixed;right:0;bottom:0;"是有问题的，因为它替换了原本为侧边栏设置的宽度width:33%;这样就造成侧边栏的宽度出现变化。后面就css就只有position:static;right:0;bottom:0;没有了宽度
- 0赞 · 0采集
-
- coComon 2017-05-05
- dom.style.cssText="position:fixed;"
-
截图0赞 · 0采集
-
- 一颗心的星空 2017-03-18
- 超过左栏高，左栏宽变小，再上拉宽又比加载时大，用审查检查发现当超过sideHeight高，cssText“替换”了左栏CSS属性为fixed；right：0；top：-1609。再上拉由于else里只是“更改”position属性，所以遗留了 right；top属性导致的 方案：if与else后跟的语句都运用cssText进行替换 if是style.cssText='width:33%;position:fixed;right:0;top:'+(-(sideHeight-screenHeight))+'px' else是style.cssText='width:33%;float:right'
-
截图0赞 · 0采集
-
- learning2 2017-03-05
- 滚定边栏
-
截图0赞 · 0采集
-
- learning2 2017-03-05
- 固定边栏滚动
-
截图0赞 · 0采集
-
- learning2 2017-03-05
- 固定边栏滚动
-
截图0赞 · 1采集
-
- learning2 2017-03-05
- 实现关键点
-
截图0赞 · 2采集
-
- 白小明 2017-03-01
- 老师写的兼容性事件chuli可能不全 addHandler : function (element,type,listener) { if (element.addEventListener) { // 2级 DOM element.addEventListener(type, listener, false); } else if (element.attachEvent) { // IE element.attachEvent('on' + type, listener); } else { // 0级 DOM // element.onclick === element['onclick'] // 在这里由于.与'on'字符串不能链接，只能用后者 element['on' + type] = listener; } }
-
截图1赞 · 0采集
-
- 慕无忌3012696 2017-02-25
- 右侧边栏不跟着左侧边栏滚动 实现技术：
- 0赞 · 0采集
-
- 慕少3280284 2017-02-23
- e
-
截图0赞 · 0采集
-
- 偏执37 2017-02-13
- JavaScript事件的封装
-
截图0赞 · 0采集
-
- 红书包 2016-12-29
- 设置fixed条件判断 滚动高度+屏幕高度>边栏高度
-
截图0赞 · 0采集
-
- 橘子_0015 2016-11-29
- mark
- 0赞 · 0采集
-
- 幻恋殇 2016-11-21
- 进入页面就触发scroll事件 还原position的属性是"static"
-
截图0赞 · 1采集
-
- 幻恋殇 2016-11-21
- 绑定window对象，取得滚动高度和屏幕可见高度
-
截图0赞 · 0采集
-
- 幻恋殇 2016-11-21
- 实现关键点
-
截图0赞 · 0采集
-
- 慕运维4918896 2016-10-27
- Triggle
- 0赞 · 0采集
-
- 慕运维4918896 2016-10-27
- 屏幕的可视高度，滚动高度
- 0赞 · 0采集
