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 EasyUI API 中文文档 - Draggable 可拖拽
Sep 29 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
May 23 Javascript
获取表单控件原始(初始)值的方法
Aug 21 Javascript
javascript获取网页各种高宽及位置的方法总结
Jul 27 Javascript
jquery封装插件时匿名函数形参和实参的写法解释
Feb 14 Javascript
vue进行图片的预加载watch用法实例讲解
Feb 07 Javascript
妙用缓存调用链实现JS方法的重载
Apr 30 Javascript
Vue中使用方法、计算属性或观察者的方法实例详解
Oct 31 Javascript
Node+OCR实现图像文字识别功能
Nov 26 Javascript
javascript事件循环event loop的简单模型解释与应用分析
Mar 14 Javascript
用VsCode编辑TypeScript的实现方法
May 07 Javascript
小程序Scroll-view上拉滚动刷新数据
Jun 21 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去除重复字的实现代码
2011/09/16 PHP
Netbeans 8.2与PHP相关的新特性介绍
2016/10/08 PHP
js实时监听文本框状态的方法
2011/04/26 Javascript
jquery实现图片裁剪思路及实现
2013/08/16 Javascript
Javascript异步编程模型Promise模式详细介绍
2014/05/08 Javascript
js获取日期:昨天今天和明天、后天
2014/06/11 Javascript
js清空表单数据的两种方式(遍历+reset)
2014/07/18 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
为什么JavaScript没有块级作用域
2016/05/22 Javascript
Javascript类型系统之String字符串类型详解
2016/06/21 Javascript
JavaScript 控制字体大小设置的方法
2016/11/23 Javascript
jQuery中的deferred使用方法
2017/03/27 jQuery
javascript简单写的判断电话号码实例
2017/05/24 Javascript
实例教学如何写vue插件
2017/11/30 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
2018/08/30 Javascript
React 实现拖拽功能的示例代码
2019/01/06 Javascript
KnockoutJS数组比较算法实例详解
2019/11/25 Javascript
angular8.5集成TinyMce5的使用和详细配置(推荐)
2020/11/16 Javascript
Python实现动态加载模块、类、函数的方法分析
2017/07/18 Python
python实现windows下文件备份脚本
2018/05/27 Python
python paramiko利用sftp上传目录到远程的实例
2019/01/03 Python
python调用c++ ctype list传数组或者返回数组的方法
2019/02/13 Python
python 同时读取多个文件的例子
2019/07/16 Python
纯css3实现思维导图样式示例
2018/11/01 HTML / CSS
美国时尚孕妇装品牌:A Pea in the Pod
2017/07/16 全球购物
Perfume’s Club中文官网:西班牙美妆在线零售品牌
2020/08/24 全球购物
Java语言程序设计测试题改错题部分
2014/07/22 面试题
计算机应用专业毕业生求职信
2014/06/03 职场文书
影视广告专业求职信
2014/09/02 职场文书
2014教师评职称工作总结
2014/11/10 职场文书
2014年药房工作总结
2014/11/22 职场文书
《只有一个地球》教学反思
2016/02/16 职场文书
干货!开幕词的写作方法
2019/04/02 职场文书
MySQL update set 和 and的区别
2021/05/08 MySQL
浅析NIO系列之TCP
2021/06/15 Java/Android
嵌入式Redis服务器在Spring Boot测试中的使用教程
2021/07/21 Redis