• ie6 下fixed 定位 js


    绝对定位

    下面是蓝色上高手用js写的:http://bbs.blueidea.com/thread-2979799-1-1.html

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
    <title>Untitled Document</title>
    <style>
    	html,body{
    		padding:0;
    		margin:0;
    	}
    </style>
    </head>
    <body>
    	<div id="aa" style="100px;height:100px;background:#c0c0c0;" >我在随平滚</div>
    	<div id="bb" style="100px;height:100px;background:#c0c0c0;" >我静止不动</div>
    	<div style="100%;height:1500px;background:#000"></div>
    	<div style="100%;height:1500px;background:green"></div>
    	<div style="100%;height:1500px;background:red"></div>
    </body>
    </html>
    <script>
       	function scroll(p){
        	var d = document,dd = d.documentElement,db = d.body,w = window,o = d.getElementById(p.id),ie = /msie/i.test(navigator.userAgent),style,timer;
        	if(o){
    			//ie8下position:fixed下top left失效
        		o.style.cssText +=";position:"+(p.f&&!ie?'fixed':'absolute')+";"+(p.l==undefined?'right:0;':'left:'+p.l+'px;')+(p.t!=undefined?'top:'+p.t+'px':'bottom:0');
        		if(p.f&&ie){
    				o.style.cssText +=';left:expression(body.scrollLeft + '+(p.l==undefined?db.clientWidth-o.offsetWidth:p.l)+' + "px");top:expression(body.scrollTop +'+(p.t==undefined?db.clientHeight-o.offsetHeight:p.t)+'+ "px" );'
    				db.style.cssText +=";background-image:url(about:blank);background-attachment:fixed;"
    			}else{
    				if(!p.f){
    					 w.onresize = w.onscroll = function(){
    						clearInterval(timer);
    						timer = setInterval(function(){
    							var st = db.scrollTop,c;
    							c = st  - o.offsetTop + (p.t!=undefined?p.t:(w.innerHeight||db.clientHeight)-o.offsetHeight);
    							if(c!=0){
    								o.style.top = o.offsetTop + Math.ceil(Math.abs(c)/10)*(c<0?-1:1) + 'px';
    							}else{
    								clearInterval(timer);		
    							}
    						},10)
    					}
    				}
    			}
        	}  
        }
        scroll({
        	id:'aa'
    	
        })
    	 scroll({
    		id:'bb',
    		l:0,
    		t:200,
    		f:1
    	 })
        /*
        	id 你要滚动的内容的id
        	l 横坐标的位置  不写为紧贴右边
        	t 你要放在页面的那个位置默认是贴着底边 0是贴着顶边
        	f 1表示固定 不写或者0表示滚动
        */
    </script>


  • 相关阅读:
    vue学习笔记 样式 class style(五)
    vue学习笔记 计算属性(四)
    vue学习笔记 模板语法(三)
    vue学习笔记 实例(二)
    vue学习笔记 概述(一)
    Babel指南——基本环境搭建
    手动es6编译es5(命令行)
    TrimPath
    git 远程仓库管理
    CSS左侧固定宽 右侧自适应(兼容所有浏览器)
  • 原文地址:https://www.cnblogs.com/hdchangchang/p/3965394.html
Copyright © 2020-2023  润新知