Javascript实现带关闭按钮的网页漂浮广告代码


Posted in Javascript onJanuary 12, 2014
<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"> 
<a href="#" target="_blank"><img border="0" src="图片路径" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a> 
<span style="CURSOR:hand;color:red;font-weight:bold" onclick="clearInterval(interval);img.style.visibility = 'hidden'">X</span> 
</div> 
<script language=javascript src=ff.js> </script> 
</body> 
</html>

ff.js代码
var xPos = 20; 
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();
Javascript 相关文章推荐
jQuery实现为图片添加镜头放大效果的方法
Jun 25 Javascript
js实现拉幕效果的广告代码
Sep 02 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
Oct 09 Javascript
Bootstrap响应式侧边栏改进版
Sep 17 Javascript
手把手搭建安装基于windows的Vue.js运行环境
Jun 12 Javascript
vue中页面跳转拦截器的实现方法
Aug 23 Javascript
JS实现图片居中悬浮效果
Dec 25 Javascript
解决vue this.$forceUpdate() 处理页面刷新问题(v-for循环值刷新等)
Jul 26 Javascript
使用JS监听键盘按下事件(keydown event)
Nov 07 Javascript
vue+element 实现商城主题开发的示例代码
Mar 26 Javascript
如何使用three.js 制作一个三维的推箱子游戏
Jul 29 Javascript
微信小程序实现滚动Tab选项卡
Nov 16 Javascript
jquery toolbar与网页浮动工具条具体实现代码
Jan 12 #Javascript
jQuery在iframe中无法弹出对话框的解决方法
Jan 12 #Javascript
js弹窗返回值详解(window.open方式)
Jan 11 #Javascript
JS中表单的使用小结
Jan 11 #Javascript
js opener的使用详解
Jan 11 #Javascript
JS获取下拉列表所选中的TEXT和Value的实现代码
Jan 11 #Javascript
JS,Jquery获取select,dropdownlist,checkbox下拉列表框的值(示例代码)
Jan 11 #Javascript
You might like
用PHP连接Oracle for NT 远程数据库
2006/10/09 PHP
php中in_array函数用法分析
2014/11/15 PHP
Yii2.0 Basic代码中路由链接被转义的处理方法
2016/09/21 PHP
firefox下jQuery UI Autocomplete 1.8.*中文输入修正方法
2012/09/19 Javascript
jquery 检测元素是否存在的实例代码
2013/11/19 Javascript
js动画效果制件让图片组成动画代码分享
2014/01/14 Javascript
jQuery 2.0.3 源码分析之core(一)整体架构
2014/05/27 Javascript
node.js中RPC(远程过程调用)的实现原理介绍
2014/12/05 Javascript
JavaScript+html5 canvas制作的圆中圆效果实例
2016/01/27 Javascript
jQuery EasyUI 入门必看
2016/06/03 Javascript
jQuery的 $.ajax防止重复提交的两种方法(推荐)
2016/10/14 Javascript
Vue.js中的computed工作原理
2018/03/22 Javascript
js调用设备摄像头的方法
2018/07/19 Javascript
JS 实现获取验证码 倒计时功能
2018/10/29 Javascript
JS基于Location实现访问Url、重定向及刷新页面的方法分析
2018/12/03 Javascript
js前端面试之同步与异步问题详解
2019/04/03 Javascript
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
2019/05/13 Javascript
JS面向对象编程基础篇(二) 封装操作实例详解
2020/03/03 Javascript
微信小程序中data-key属性之数据传输(经验总结)
2020/08/22 Javascript
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
解决python写的windows服务不能启动的问题
2014/04/15 Python
Python中用post、get方式提交数据的方法示例
2017/09/22 Python
python+selenium实现京东自动登录及秒杀功能
2017/11/18 Python
Python中的引用知识点总结
2019/05/20 Python
Python中生成一个指定长度的随机字符串实现示例
2019/11/06 Python
Python计算指定日期是今年的第几天(三种方法)
2020/03/26 Python
后端开发使用pycharm的技巧(推荐)
2020/03/27 Python
关于keras中keras.layers.merge的用法说明
2020/05/23 Python
基于Python爬取fofa网页端数据过程解析
2020/07/13 Python
Python压缩模块zipfile实现原理及用法解析
2020/08/14 Python
2020年10款优秀的Python第三方库,看看有你中意的吗?
2021/01/12 Python
CSS3自定义滚动条样式的示例代码
2017/08/21 HTML / CSS
YSL圣罗兰美妆美国官网:Yves Saint Lauret US
2016/11/21 全球购物
意大利在线药房:Farmacia Loreto Gallo
2019/08/09 全球购物
爱情保证书
2015/01/17 职场文书
律师函格式范本
2015/05/27 职场文书