昨天為同行公司IT做了一點網頁漂浮的特效！

HTML代碼如下：Code
<DIV id=img1 style="Z-INDEX: 100; LEFT: 2px; WIDTH: 200px; POSITION: absolute; TOP: 43px; HEIGHT: 100px;
 visibility: visible;"><a href="http://www.sut56.com/index.asp" target="_blank"><img src="images/pic.gif" width="150" height="180" border="0"></a></DIV>
<SCRIPT src="js/js.js"></SCRIPT>

javascript效果代碼如下：Code
var xPos =300;
var yPos = 200; 
var step = 1;
var delay = 20; 
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);
    }
    function pause_resume() 
    {
        if(pause) 
        {
            clearInterval(interval);
            pause = false;}
        else 
        {
            interval = setInterval('changePos()',delay);
            pause = true; 
            }
        }
    start();

此檔案另存新檔JS目錄下js.js

圖片來源：