当前位置：Gxlcms > JavaScript > js漂浮广告实现代码（合集经典）符合W3C

js漂浮广告实现代码（合集经典）符合W3C

时间：2021-07-01 10:21:17 帮助过：2人阅读

第一种漂浮广告不符合W3C
JavaScript漂浮广告代码，很不错，代码精简，不过一次只有漂一个，复制就能用了。希望站长朋友喜欢。

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
第二种漂浮广告不符合标准
Js漂浮广告代码，比较经典的浮动广告，到现还很实用，如果你是一位站长的话，这种代码是必备的，希望对你有用处。

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>漂浮广告</title> 
</head> 
<body> 
<img src="https://img.gxlcms.com/https://img.gxlcms.com//Uploads-s//Uploads-s/new/2019-09-17-201917/logo.gif" width="80" height="80" border="0"> 
<SCRIPT> 
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); } 
}

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]
上面两个都是不支持标准声明的
第三种符合W3C的漂浮广告代码

<!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>符合W3C的漂浮广告代码-脚本之家</title> 
</head> 
<body> 
<script> 
document.write (" ") 
document.write ("  ") 
document.write (" <img src='/upload/201204/20120411210123566.gif'style=border:none;/> ") 
document.write ("  ") 
var xPos = 300; 
var yPos = 200; 
var step = 1; 
var delay = 8; 
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.documentElement.clientWidth; 
height = document.documentElement.clientHeight; 
Hoffset = img1.offsetHeight; 
Woffset = img1.offsetWidth; 
img1.style.left = xPos + document.documentElement.scrollLeft; 
img1.style.top = yPos + document.documentElement.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(); 
</script> 
</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

js漂浮广告实现代码（合集经典） 符合W3C

人气教程排行

js漂浮广告实现代码（合集经典）符合W3C