滾動后頁面有問題
<script type="text/javascript">
/*var jWindow = $(window);
//滾動事件
jWindow.scroll(function(){
//窗口滾動的高度
var scrollHeight = jWindow.scrollTop();
//屏幕可減去
var screenHeight = jWindow.height();
//左側滾動欄的高度
var sideHeight = $('#side').height();
if(scrollHeight + screenHeight > sideHeight){//滾動的高度加上屏幕的高度大于左側欄的高度
$('#side').css({
'position':'fixed',
'top':-(sideHeight-screenHeight)+1,
'right':0
});
}else{
$('#side').css({
'position':'static',
});
}
});
window.onload = function(){
jWindow.trigger('scroll');
};
jWindow.resize(function(){
jWindow.trigger('scroll');//jquery方法
});*/
//返回的動引用
var $ ?= function(id){
return document.getElementById(id);
}
//一個元素綁定多個函數
var addEvent = function (obj,event,fn){
if(obj.addEventListener){
obj.addEventListener(event,fn,false);//冒泡或捕獲的方式
}else if(obj.attachEvent){
obj.attachEvent('on'+event,fn);//ie 接受的事件模型
}
}
var domSider = $('side');
var scrollEvent ?= function(){
var sideHeight = domSider.offsetHeight; //offsetHeight直接獲取側欄的高度
var screenHeight ?= document.documentElement.clientHeight || document.body.clientHeight;
var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop;
if(screenHeight+scrollHeight > sideHeight){
domSider.style.cssText = 'position:fixed;right:0px;top:'+(-(sideHeight-screenHeight))+'px';
}else{
domSider.style.position = 'static';
}
}
addEvent(window,'scroll',function(){
scrollEvent();
});
addEvent(window,'resize',function(){
scrollEvent();
});
滾動后::::
滾動前:::
</script>
2017-10-18
2016-09-28
var scrollEvent = function(){
? ?var sideHeight = domSider.offsetHeight;
? ?var screenHeight =document.documentElement.clientHeight||document.body.clientHeight;
? ?var scrollHeight = document.documentElement.scrollTop||document.body.scrollTop;
? ?//滾動高度+屏幕高度>邊欄高度。,此時要設置position:fixed
? ?if(scrollHeight+screenHeight>sideHeight){
? ? ? ?domSider.style.cssText = 'position:fixed;right:0px;top:'+(-(sideHeight-screenHeight))+'px';
? ?}else{
? ? ? ?domSider.style.position='static';
? ?}
}