-
原生写法
查看全部 -
js原生写法
查看全部 -
封装获取id，和绑定时间+兼容
查看全部 -
JQ的方法
查看全部 -
避免浏览器bug
查看全部 -
封装动引用查看全部
-
前端查看全部
-
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.封装 取id 2.封装浏览器兼容查看全部
举报