您的位置:首页 > Web前端 > JavaScript

JS实现漂浮广告

2012-07-10 14:27 323 查看
<script language="javascript" type="text/javascript">
// JavaScript Document
//设置广告块
var divLeft = 0;
//设置广告块初始左边位置
var divTop = 0;
//设置广告块初始顶部位置
var divWidth = 120;
//设置广告块宽度
var divHeight = 80;
//设置广告块高度
var divImg = "http://portal.nmc.ln.cmcc/PublishingImages/yunweiguanli.JPG";
//设置广告图片的URL地址
var divUrl = "http://net.chinamobile.com/";
//设置广告链接
var divTitle = "http://net.chinamobile.com/";
//设置div标题
document.write("<DIV id=\"adDiv\" style=\"position:absolute; left:"+divLeft);
document.write("px; top:"+divTop+"px; width:"+divWidth+"px; height:"+divHeight);
document.write("px; z-index:1;\" onMouseOver=\"javascript:window.clearInterval(varId)\"");
document.write(" onMouseOut=\"javascript:beginMoveAd();\"><a style=\"font-size:12px;\" href=\"" + divUrl + "\" target=\"_blank\">");
document.write("<img src=\"" + divImg + "\" border=\"0\" alt=\"" + divTitle + "\"></a><br>");
//document.write("<a href=\"javascript:\" onclick=\"document.getElementByIdx('adDiv').style.display='none';\">");
//document.write("<font>关闭广告</font></a>");
document.write("</DIV>");
//飘浮广告
var _stepx=2;_stepy=2;
//初始化每次偏离的象素
var moveSpeed=40;
//速度
var varId;
//获取setInterval的ID
function moveAd()
{
//飘浮广告主函数
var adLeft=parseInt(adDiv.style.left);
var adTop=parseInt(adDiv.style.top);
var adWidth=parseInt(adDiv.style.width);
var adHeight=parseInt(adDiv.style.height);
var _bodyLeft=document.body.scrollLeft;
var _bodyTop=document.body.scrollTop;
var _bodyHeight=document.body.clientHeight+_bodyTop;
var _bodyWidth=document.body.clientWidth+_bodyLeft;
if(adLeft<=_bodyLeft)
{
_stepx=2;
}
if(adTop<=_bodyTop)
{
_stepy=2;
}
if((adLeft+adWidth)>=_bodyWidth)
{
_stepx=-2;
}
if((adTop+adHeight)>=_bodyHeight)
{
_stepy=-2;
}
adDiv.style.left=adLeft+_stepx;
adDiv.style.top=adTop+_stepy;
}

function beginMoveAd()
{
//启动飘浮
varId = window.setInterval("moveAd()",moveSpeed);
}
//给窗体的load事件附加飘浮函数
window.onload=beginMoveAd();
</script>

<script language="javascript" type="text/javascript">
// JavaScript Document
//设置广告块
var divImgLeft = 300;
//设置广告块初始左边位置
var divImgTop = 0;
//设置广告块初始顶部位置
var divImgWidth = 280;
//设置广告块宽度
var divImgHeight = 110;
//设置广告块高度
var divImg = "http://portal.nmc.ln.cmcc/Image%20Library/fz60.jpg";
//设置广告图片的URL地址
var divImgUrl = "";
//设置广告链接
var divImgTitle = "";
//设置div标题
document.write("<DIV id=\"imgDiv\" style=\"position:absolute; left:" + divImgLeft);
document.write("px; top:" + divImgTop + "px; width:" + divImgWidth + "px; height:" + divImgHeight);
document.write("px; z-index:1;\" onMouseOver=\"javascript:window.clearInterval(varImgId)\"");
document.write(" onMouseOut=\"javascript:beginImgMoveAd();\"><a href=\"" + divImgUrl + "\" target=\"_blank\">");
document.write("<img src=\"" + divImg + "\" border=\"0\" alt=\"" + divImgTitle + "\"></a><br>");
//document.write("<a href=\"javascript:\" onclick=\"document.getElementByIdx('adDiv').style.display='none';\">");
//document.write("<font>关闭广告</font></a>");
document.write("</DIV>");
//飘浮广告
var _stepImgx=3;_stepImgy=3;
//初始化每次偏离的象素
var moveImgSpeed=30;
//速度
var varImgId;
//获取setInterval的ID
function moveImg()
{
//飘浮广告主函数
var imgLeft = parseInt(imgDiv.style.left);
var imgTop = parseInt(imgDiv.style.top);
var imgWidth = parseInt(imgDiv.style.width);
var imgHeight = parseInt(imgDiv.style.height);
var _bodyImgLeft=document.body.scrollLeft;
var _bodyImgTop=document.body.scrollTop;
var _bodyImgHeight=document.body.clientHeight+_bodyImgTop;
var _bodyImgWidth=document.body.clientWidth+_bodyImgLeft;
if (imgLeft <= _bodyImgLeft)
{
_stepImgx = 3;
}
if (imgTop <= _bodyImgTop)
{
_stepImgy = 3;
}
if ((imgLeft + imgWidth) >= _bodyImgWidth)
{
_stepImgx = -3;
}
if ((imgTop + imgHeight) >= _bodyImgHeight)
{
_stepImgy = -3;
}
imgDiv.style.left = imgLeft + _stepImgx;
imgDiv.style.top = imgTop + _stepImgy;
}

function beginImgMoveAd()
{
//启动飘浮
varImgId = window.setInterval("moveImg()", moveImgSpeed);
}
//给窗体的load事件附加飘浮函数
window.onload = beginImgMoveAd();
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: