<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>带关闭按钮的网页漂浮广告代码</title> </head> <body> <div id="img" style="position: absolute; left: 311; top: 815;visibility :hidden;" onmouseover="clearInterval(interval)" onmouseout="interval = setInterval('changePos()', delay)" align="right"> <img border="0" src="https://static3.51cto.com/home/web/p_w_picpaths/Flogo.png" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/> <span style="CURSOR:hand;color:red;font-weight:bold" onclick="clearInterval(interval);img.style.visibility = 'hidden'">X</span> </div> <script language=javascript> var xPos = 20;//from alixixi.com var yPos = document.body.clientHeight; 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; img.style.top = yPos; function changePos() { width = document.body.clientWidth; height = document.body.clientHeight; Hoffset = img.offsetHeight; Woffset = img.offsetWidth; img.style.left = xPos + document.body.scrollLeft; img.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() { img.style.visibility = "visible"; interval = setInterval('changePos()', delay); } start(); </script> </body> </html>
JS带关闭按钮的网页漂浮广告代码
原创
©著作权归作者所有:来自51CTO博客作者菜鸟不菜么的原创作品,请联系作者获取转载授权,否则将追究法律责任
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
JS选择图片获取base64编码预览图片
通过将图片转为data url的base64格式编码,实现直接预览图片
图片预览 base64 dataurl 图片转base64 -
图片漂浮与点击放大
<--------个
html javascript css -
插入随机/跟随鼠标/点击一次即消失/漂浮图片(ie测试通过)
//跟随方法比document.click不足之处:当出现cpu占用过高时,会出现跟
测试 ie border function Math -
悬浮图片之上效果实现
其实很简单,就是一个margin top的问题,但是需要relative的定位方式才能悬在上面。 html部分 css
ico 大数据平台 多语言 云计算平台 新技术 -
#yyds干货盘点#CSS实现漂浮效果
css 漂浮效果
css 特效 漂浮效果 -
网页中漂浮的图片代码
这是网页中一个漂浮的图片代码,有兴趣者可下载。
职场 休闲 漂浮 -
day14 python css 漂浮的学习
a f
html 父类 子类 -
HTML+CSS制作漂浮的对话框
HTML+CSS制作漂浮的对话框效果图如下:HTML部分源代码如下:<!DOCTYPE html><html
css css3 html html5 初始化 -
漂浮广告
漂浮广告(一) <DIV id=imgstyle=position:absolute;width:120;height:69
.net 绝对路径 javascript