本文實(shí)例講述了JS實(shí)現(xiàn)彈性漂浮效果的廣告代碼。分享給大家供大家參考。具體如下：

這里介紹一款JS彈性漂浮廣告代碼，碰到網(wǎng)頁(yè)瀏覽器的邊緣就會(huì)順著彈力的方向自動(dòng)漂浮下去，不停的在網(wǎng)頁(yè)上漂來(lái)漂去，漂浮廣告代碼是很早時(shí)候就有的代碼了，使用廣泛，而且做為廣告來(lái)說(shuō)，好像效果還不錯(cuò)，因?yàn)樗诓煌５膭?dòng)，讓人在視覺(jué)上感覺(jué)到有一種吸引力。其中的JS代碼你可以扣出來(lái)保存在一個(gè)單獨(dú)的JS文件中，使用時(shí)調(diào)用即可。

運(yùn)行效果截圖如下：

在線演示地址如下：

具體代碼如下：

Js彈性漂浮廣告代碼visibility: visible;">

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);

}

function pause_resume()

{

if(pause)

{

clearInterval(interval);

pause = false;}

else

{

interval = setInterval('changePos()',delay);

pause = true;

}

}

start();

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

總結(jié)

以上是生活随笔為你收集整理的html网页漂浮广告原理js,JS实现弹性漂浮效果的广告代码的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。