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+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)
Apr 25 Javascript
jQuery简易图片放大特效示例代码
Jun 09 Javascript
深入理解JavaScript系列(40):设计模式之组合模式详解
Mar 04 Javascript
jQuery+CSS3折叠卡片式下拉列表框实现效果
Nov 02 Javascript
基于javascript简单实现对身份证校验
Jan 25 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 Javascript
JavaScript运动框架 解决速度正负取整问题(一)
May 17 Javascript
Vue.js中组件中的slot实例详解
Jul 17 Javascript
jQuery 操作 HTML 元素和属性的方法
Nov 12 jQuery
解决Echarts 显示隐藏后宽度高度变小的问题
Jul 19 Javascript
解决vue 给window添加和移除resize事件遇到的坑
Jul 21 Javascript
Node与Python 双向通信的实现代码
Jul 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中error_reporting()函数的用法(修改PHP屏蔽错误)
2011/07/01 PHP
php分页示例分享
2014/04/30 PHP
PHP之uniqid()函数用法
2014/11/03 PHP
PHP限制HTML内容中图片必须是本站的方法
2015/06/16 PHP
php中实现用数组妩媚地生成要执行的sql语句
2015/07/10 PHP
详解WordPress中提醒安装插件以及隐藏插件的功能实现
2015/12/25 PHP
PHP实现上传图片到 zimg 服务器
2016/10/19 PHP
PHP从零开始打造自己的MVC框架之入口文件实现方法详解
2019/06/03 PHP
关于全局变量和局部变量的那些事
2013/01/11 Javascript
JS中Date日期函数中的参数使用介绍
2014/01/02 Javascript
jQuery Mobile中的button按钮组件基础使用教程
2016/05/23 Javascript
JavaScript提高网站性能优化的建议(二)
2016/07/24 Javascript
easyui combotree加载静态数据问题(选不上)解决方法
2016/12/26 Javascript
微信小程序模板之分页滑动栏
2017/02/10 Javascript
js实现按座位号抽奖
2017/04/05 Javascript
Angularjs实现下拉框联动的示例代码
2017/08/22 Javascript
vue内置指令详解
2018/04/03 Javascript
浅谈Vue.js 中的 v-on 事件指令的使用
2018/11/25 Javascript
Node.js 实现远程桌面监控的方法步骤
2019/07/02 Javascript
简述vue-cli中chainWebpack的使用方法
2019/07/30 Javascript
[49:35]KG vs SECRET 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
解决python2.7用pip安装包时出现错误的问题
2017/01/23 Python
TensorFlow安装及jupyter notebook配置方法
2017/09/08 Python
itchat接口使用示例
2017/10/23 Python
疯狂上涨的Python 开发者应从2.x还是3.x着手?
2017/11/16 Python
Python while true实现爬虫定时任务
2020/06/08 Python
CSS3实现大小不一的粒子旋转加载动画
2016/04/21 HTML / CSS
如何理解transaction事务的概念
2015/05/27 面试题
毕业生就业协议书
2014/04/11 职场文书
公安局班子个人对照检查材料思想汇报
2014/10/09 职场文书
开展党的群众路线教育实践活动剖析材料
2014/10/13 职场文书
先进员工事迹材料
2014/12/20 职场文书
2016年暑假学生家长评语
2015/12/01 职场文书
详解nginx.conf 中 root 目录设置问题
2021/04/01 Servers
国产动画《万圣街》日语配音版制作决定!
2022/03/20 国漫
使用scrapy实现增量式爬取方式
2022/06/21 Python