飘动的图片

最新推荐文章于 2025-09-13 09:06:35 发布

转载最新推荐文章于 2025-09-13 09:06:35 发布 · 97 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/leamiko/archive/2009/10/26/1590159.html

文章标签：

#javascript #ViewUI

Code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>float</title>
<script type="text/javascript">
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;
img1.style.top = yPos;

function changePos()
{
    width = document.body.clientWidth;
    height = document.body.clientHeight;
    Hoffset = img1.offsetHeight;
    Woffset = img1.offsetWidth;
    img1.style.left = xPos + document.body.scrollLeft;
    img1.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()
{
   img1.visibility = "visible";
     interval = setInterval('changePos()', delay);
     document.getElementById('imgsrc').onclick=function(){
     document.getElementById('img1').style.visibility='hidden';
}
}
function pause_resume()
{
    if(pause)
    {
      clearInterval(interval);
    pause = false;}
    else
    {
      interval = setInterval('changePos()',delay);
       pause = true;
  }
}
</script>
<style type="text/css">
        #img1{z-index:100;left:2px;top:43px;width:272px;height:62px;position:absolute;visibility:visible;}
        #img1 a{
            text-decoration:none;
            font-size:12px;
            color:#333;
        }
        #img1 a:hover{
            background-color:#ffb6b5;
            /*border:1px solid #ffb6b5 fff7f7;
            padding:1px;*/
        }
</style>
</head>

<body onload="start()">
<div id="img1">
    <a href="http://iitsi2010.jgsu.edu.cn"><img src="IITSI2010.gif" border="0" alt="点击进入井冈山大学IITSI2010网站"/></a><span><a href="#" id="imgsrc">关闭</a></span>
</div>
</body>
</html>

转载于:https://www.cnblogs.com/leamiko/archive/2009/10/26/1590159.html