浮动代码，兼容各种浏览器

最新推荐文章于 2024-11-11 23:26:32 发布

乞儿不再叫江

最新推荐文章于 2024-11-11 23:26:32 发布

阅读量813

点赞数

文章标签：浏览器 function xhtml div javascript border

本文链接：https://blog.csdn.net/qierjiang/article/details/6638930

版权

PS: 在各种商业性的网站上的都会用那些客服之类的浮动图标，但并非兼容各种不同种类的浏览器，这里是从别人的代码中提取出来的JS代码，几乎可以完美的兼容各种浏览器，至于其中的JS代码，我也领悟不多，就不乱讲解了，贴出代码大家一起参考～～

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
<title>网站</title>
<style type="text/css">

	#divStayTopleft{
	width:116px;
	height:230px;
	background-repeat: no-repeat;
	left:1350px;
	top: 70px;
	}	
 #qq{width:120px; height:90px; margin-top:50px;}
</style>
</head>

<body>
<DIV id=zove >
<div id="divStayTopleft" style="POSITION: absolute"> 
<div id="qq">
<TBODY>
  <TABLE font-family:'宋体'; font-size:16px; color: #000 style="FLOAT: left;width=110 align="center" >
  <TR>
          <TD height=80></TD></TR>
<tr><td>
<script>document.write("<a target=blank href=tencent://message/?uin=742586755&Site=乞儿 &Menu=yes><img border=0 SRC=http://wpa.qq.com/pa?p=1:615050000:10 alt=[乞儿]></a>");</script></td></tr>
<tr><td>
<script>document.write("159XXXX1234");</script></td></tr>
</table>
</TBODY>
</div> 
</div>
</DIV>
<SCRIPT language=javascript>
		qier=function (id,_top,_left){
		var me=id.charAt?document.getElementById(id):id, d1=document.body, d2=document.documentElement;
		d1.style.height=d2.style.height='100%';me.style.top=_top?_top+'px':0;me.style.left=_left+"px";
		me.style.position='absolute';
		setInterval(function (){me.style.top=parseInt(me.style.top)+(Math.max(d1.scrollTop,d2.scrollTop)+_top-parseInt(me.style.top))*0.1+'px';},10+parseInt(Math.random()*20));
		return arguments.callee;
		};
		window.οnlοad=function (){
		qier
		('zove',100,-152)
		}
</SCRIPT>

</body>
</html>

下面是可折叠部分代码一并贴上

<SCRIPT language=javascript> 
			lastScrollY=0; 
			
			var InterTime = 1;
			var maxWidth=-1;
			var minWidth=-152;
			var numInter = 8;
			
			var BigInter ;
			var SmallInter ;
			
			var o =  document.getElementById("zove");
				var i = parseInt(o.style.left);
				function Big()
				{
					if(parseInt(o.style.left)<maxWidth)
					{
						i = parseInt(o.style.left);
						i += numInter;	
						o.style.left=i+"px";	
						if(i==maxWidth)
							clearInterval(BigInter);
					}
				}
				function toBig()
				{
					clearInterval(SmallInter);
					clearInterval(BigInter);
						BigInter = setInterval(Big,InterTime);
				}
				function Small()
				{
					if(parseInt(o.style.left)>minWidth)
					{
						i = parseInt(o.style.left);
						i -= numInter;
						o.style.left=i+"px";
						
						if(i==minWidth)
							clearInterval(SmallInter);
					}
				}
				function toSmall()
				{
					clearInterval(SmallInter);
					clearInterval(BigInter);
					SmallInter = setInterval(Small,InterTime);
					
				}
				
</SCRIPT>

然后改DIV为

<DIV id=zove οnmοuseοver=toBig() οnmοuseοut=toSmall()>

乞儿不再叫江

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫