全屏浮动js

查看效果: http://www.leyikao.com

 

源代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>安博中程乐易考</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<body>
<div id="img" style="LEFT:20px; visibility:hidden;POSITION:absolute; TOP:20px;z-index:10000;"><a href="http://www.leyikao.com/t/beida/" target="_blank"><img src="http://www.leyikao.com/templets/default/Images/logobeida.jpg" width="127" height="46" border="0" style="cursor:pointer;"/></a></div>
<script language="javascript">
<!-- Begin
var xPos = 20;
var yPos = document.documentElement.clientHeight;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
var img = document.getElementById("img");
img.style.top = yPos; function changePos() {   
  width=document.documentElement.clientWidth;   
   height=document.documentElement.clientHeight; 
   Hoffset=img.offsetHeight;
     Woffset=img.offsetWidth;
     img.style.left=xPos+document.body.scrollLeft+"px";   
    img.style.top=yPos+document.body.scrollTop+"px";

    yPos = yPos + step*(yon?1:-1)
    if(yPos<0) {  yon=1;  yPos=0;  }
    if(yPos>=(height-Hoffset)) { yon=0;  yPos=(height-Hoffset);  }
    xPos = xPos + step*(xon?1:-1)  
    if(xPos<0) { xon=1;  xPos=0; }
    if(xPos>=(width-Woffset)) { xon=0;xPos=(width-Woffset); } }

    function start() {
        img.style.visibility="visible";
        interval=setInterval('changePos()',delay);
        img.οnmοuseοver=function(){clearInterval(interval)}
        img.οnmοuseοut=function(){interval=setInterval("changePos()", delay)}
    }
    start();
//  End -->
</script>
</body>
</html>

 

查看效果: http://www.leyikao.com

转载于:https://www.cnblogs.com/jjklmm/archive/2012/07/19/2598678.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值