JS固定邊欄滾動

1、 css position fixed：作用把邊欄做乙個固定

還要在設定一下位置，因為脫離文件流之後，會向左側浮動，所以要設定相對瀏覽器右側的距離。

2、監聽window上的滾動事件

3、設定fixed條件判斷的依據：滾動高度 + 螢幕高度 > 邊欄高度

1
<
script 
src=""
>
script
>23
<
script
>45
varjwindow 
=$(window);
//獲取window窗體67
jwindow.scroll(functoin) );
2627
}else
);3435}
3637
});38
39window.onload(
function
() );
//監聽window的onload事件
4445
jwindow.resize(
function
());
//監聽resize事件
5051
script
>

另一種方法js

1
<
script
>23
var$ 
=function
(id) 89
varaddevent 
=function
(obj,event,fn) 
else
if(obj.attachevent) 
2021}//
事件繫結元素
2223
vardomside =$(
'j_bdside');
2425
varscrollevent 
=function
() else 
4243
}//scroll事件做一次封裝
4445
addevent(window,
'scroll
',function());
5051
addevent(window,
'resize
'function());
5657
5859

html dom addeventlistener() 方法

測試能不能呼叫函式

頁面滾動時固定選單欄

往下拖動頁面滾動條時，固定住選單欄不隨其他內容網上滾動，相容各版本ie chrome firefox aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaa aa...

js 實現兩欄同時滾動

這個需求有點意思，拿出來和大家分享一下。如果你去實現過這樣的效果，或者類似這樣的效果的，你會發現簡單去一欄控制另一欄的的滾動距離，另一欄類似控制第一欄的效果的話。你會發現基本上可能滾動不了，優化之後通過函式節流，等其他手段優化之後也是很卡，滾動會不流暢。原因主要是因為當你改變乙個元素的scroll...

JS固定邊欄滾動

頁面滾動時固定選單欄

js 實現兩欄同時滾動

js 實現兩欄同時滾動

相關推薦