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 相关文章推荐
Extjs中ComboBoxTree实现的下拉框树效果(自写)
May 28 Javascript
jQuery简单tab切换效果实现方法
Apr 08 Javascript
JavaScript的History API使搜索引擎抓取AJAX内容
Dec 07 Javascript
JavaScript资源预加载组件和滑屏组件的使用推荐
Mar 10 Javascript
js鼠标移动时禁止选中文字
Feb 19 Javascript
jquery 键盘事件的使用方法详解
Sep 13 jQuery
JavaScript判断变量名是否存在数组中的实例
Dec 28 Javascript
基于Vue 2.0 监听文本框内容变化及ref的使用说明介绍
Aug 24 Javascript
基于js实现判断浏览器类型代码实例
Jul 17 Javascript
vue项目接口管理,所有接口都在apis文件夹中统一管理操作
Aug 13 Javascript
vue3.0+vue-router+element-plus初实践
Dec 02 Vue.js
element中Steps步骤条和Tabs标签页关联的解决
Dec 08 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 park、unpark、ord 函数使用方法(二进制流接口应用实例)
2010/10/19 PHP
一个PHP针对数字的加密解密类
2014/03/20 PHP
如何让CI框架支持service层
2014/10/29 PHP
php实现插入排序
2015/03/29 PHP
PHP后期静态绑定之self::限制实例分析
2018/12/21 PHP
PHP后期静态绑定实例浅析
2018/12/21 PHP
jquery tablesorter.js 支持中文表格排序改进
2009/12/09 Javascript
JS Replace 全部替换字符的用法小结
2013/12/24 Javascript
瀑布流布局代码一例
2014/04/11 Javascript
zeroclipboard 单个复制按钮和多个复制按钮的实现方法
2014/06/14 Javascript
jquery实现美观的导航菜单鼠标提示特效代码
2015/09/06 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
2016/06/03 Javascript
基于vue.js实现图片轮播效果
2016/12/01 Javascript
Vue项目组件化工程开发实践方案
2018/01/09 Javascript
解决easyui日期时间框ie的兼容的问题
2018/03/01 Javascript
使用jquery DataTable和ajax向页面显示数据列表的方法
2018/08/09 jQuery
express启用https使用小记
2019/05/21 Javascript
js之切换全屏和退出全屏实现代码实例
2019/09/09 Javascript
微信小程序实现轨迹回放的示例代码
2019/12/13 Javascript
[02:12]2015国际邀请赛 SHOWOPEN
2015/08/05 DOTA
跟老齐学Python之关于循环的小伎俩
2014/10/02 Python
python实现将pvr格式转换成pvr.ccz的方法
2015/04/28 Python
详解Python Socket网络编程
2016/01/05 Python
python区块及区块链的开发详解
2019/07/03 Python
MNIST数据集转化为二维图片的实现示例
2020/01/10 Python
Pandas之read_csv()读取文件跳过报错行的解决
2020/04/21 Python
生物科学专业职业规划书范文
2014/02/11 职场文书
2014年司机工作总结
2014/11/21 职场文书
优秀少先队辅导员事迹材料
2014/12/24 职场文书
督导岗位职责范本
2015/04/10 职场文书
《称赞》教学反思
2016/02/17 职场文书
2019单位介绍信怎么写
2019/06/24 职场文书
详解python中[-1]、[:-1]、[::-1]、[n::-1]使用方法
2021/04/25 Python
详解Python 3.10 中的新功能和变化
2021/04/28 Python
python图像处理基本操作总结(PIL库、Matplotlib及Numpy)
2021/06/08 Python
python_tkinter事件类型详情
2022/03/20 Python