-
我的笔记 固定边栏滚动特效查看全部
-
JS方法获取高度: 边栏真实高度:domSider.offsetHeight; 屏幕可见区域高度:document.documentElement.clietHeight || document.body.clientHeight; 屏幕滚动高度:document.documentElement.scrollTop || document.body.scrollTop; 设置多个CSS属性的方法:domSider.style.cssText = 'position:fixed;right:0;top:'+(-(sideHeight-screenHeight))+'px';查看全部
-
加载和改变大小时,手动触发scroll事件查看全部
-
具体代码查看全部
-
滚动条查看全部
-
实现的关键点查看全部
-
实现关键点 1、css position fixed 2、监听window上的滚动事件 3、设置fixed条件判断 滚动高度+屏幕高度(屏幕的可视区)》边栏高度 <div id="J_Bdside" class="side" > <script src="https://code.jquery.com/jquery.js"></script> <script> var jwindow = $(window); jwindow.scroll(function(){ var scrollHeight = jwindow.scrollTop(); var screenHeight = jwindow.height(); var sideHeight = $('#J_BdSide').height(); if(scrollHeight+screenHeight>sideHeight){ $(#J_BdSIDE).css({ 'position':'fixed', 'top':-(sideHeight-screenHeight), 'right':0 }); }else{ $('#J_BdSide').css({ 'position':'static' }); } }); window.onload = function(){ jwindow.trigger('scroll'); }; jwindow.resize(function(){ jwindow.trigger('scroll'); }); </script>查看全部
-
<div id="J_Bdside" class="side" >查看全部
-
实现关键点 1、css position fixed查看全部
-
div不随着移动查看全部
-
任远: renren查看全部
-
trigger("滚动事件") -- window.onload & window.resize查看全部
-
固定边栏滚动特效查看全部
-
实现关键点:固定边栏滚动特效查看全部
-
javascript的代码实现固定边栏滚动特效查看全部
举报
0/150
提交
取消