漂浮图片

===js代码=====

var xPos = 300;
var yPos = 200; 
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 divid = float_img1; //浮动DIV的ID.
divid.style.top = yPos;
function changePos(){
   width = document.body.clientWidth;
   height = document.body.clientHeight;
   Hoffset = divid.offsetHeight;
   Woffset = divid.offsetWidth;
   divid.style.left = xPos + document.body.scrollLeft;
   divid.style.top = yPos + document.body.scrollTop;
   if(yon){yPos = yPos + step;}else{yPos = yPos - step;}
   if(yPos < 0){yon = 1;yPos = 0;}
   if(yPos >= (height - Hoffset)){yon = 0; yPos = (height - Hoffset);}
   if(xon){xPos = xPos + step;}else{xPos = xPos - step;}
   if(xPos < 0){xon = 1;xPos = 0;}
   if(xPos >= (width - Woffset)){xon = 0; xPos = (width - Woffset);}
}
function start(){
   divid.visibility = "visible";
   interval = setInterval('changePos()',delay);
}
function pause_resume(){
   if(pause){
   clearInterval(interval);
   pause = false;}
   else{
   interval = setInterval('changePos()',delay);
   pause = true; 
   }
}
function closediv(){
   clearInterval(interval);
   divid.style.display = "none";
}
start();


===css代码====

#float_img1{position:absolute;top:43px;left:2px;z-index:10;}
#float_img1 div{text-align:right;font-size:12px;}
#float_img1 div a:link{text-decoration:none;}
#float_img1 div a:hover{color:red;text-decoration:none;}
#float_img1 img{border:1px solid ;}
p{margin-top:50px;text-align:center;}


===页面代码===

<!-- 漂浮图片 -->
<div id="float_img1" οnmοuseοver="pause_resume()" οnmοuseοut="pause_resume()">
<div><a href="javascript:void(0);" οnclick="closediv()" title="点击关闭">关闭</a></div>
<a href="http://www.baidu.com" target="_blank"><img src="image/float.jpg" alt="千名干部联系服务千家企业"></a>
</div>
<!-- js需要放在页面代码下面 -->

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值