jquery实现全屏代码+下拉底部

最新推荐文章于 2022-12-13 14:57:01 发布

Dami103

最新推荐文章于 2022-12-13 14:57:01 发布

阅读量555

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/Dami103/article/details/56014493

版权

js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
        		
	</head>
	<style>
		*{margin: 0;padding: 0;}
         #footer{width: 100%;background: #000;display: none;}
	</style>

	
	<body>
		
<div id="wrap">	
</div>



<div id="footer"></div>
<script type="text/javascript" src="js/jquery.min.js" ></script>
<script>
	//全屏图像+底部
var scrollFunc=function(e){ 
			    e=e || window.event; 
				   
			var t1=document.getElementById("footer"); 
			var t2=document.getElementById("wrap"); 
				if(e.wheelDelta){//IE/Opera/Chrome 
				if (e.wheelDelta > 0) { //当滑轮向上滚动时  
					$('#footer').css('display','none')
					$('#footer01').css('display','none')
//              t1.style.display='none'; 
                }  
                if (e.wheelDelta < 0) { //当滑轮向下滚动时  
					$('#footer').css('display','block')
					$('#footer01').css('display','block')
					
//                   t1.style.display='block'; 
                   }  
				}
				else if(e.detail){//Firefox
				       if (e.wheelDelta > 0) { //当滑轮向上滚动时  
//                        t1.style.display='none'; 
				     	$('#footer').css('display','none')
				     	$('#footer01').css('display','none')
                         }            
                       if (e.wheelDelta < 0) { //当滑轮向下滚动时  
//                      t1.style.display='block'; 
                        $('#footer').css('display','block')
                         $('#footer01').css('display','block')
                 }    
				    } 
				} 
				/*注册事件*/ 
				if(document.addEventListener){ 
				    document.addEventListener('DOMMouseScroll',scrollFunc,false); 
				}//W3C 
				window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome 
				
var hh=$(window).height()
//var fth=hh*0.2
var fth=108
var fth01=216

var lefthh=hh
		$(document).ready(function(){
			$('#wrap').height(hh);
			$('#footer').height(fth);
			$('#footer01').height(fth01);	
//			$('#leftSide').height(lefthh);
		})
		

</script>
</body>


</html>

Dami103

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jquery实现全屏代码+下拉底部

*{margin: 0;padding: 0;} #footer{width: 100%;background: #000;display: none;} //全屏图像+底部var scrollFunc=function(e){ e=e || window.event; var t1=documen
复制链接

扫一扫