JS实现很实用的对联广告代码(可自适应高度)


Posted in Javascript onSeptember 18, 2015

本文实例讲述了JS实现很实用的对联广告代码(可自适应高度)。分享给大家供大家参考。具体如下:

这是一款很实用的基于JS+CSS+DIV的网页对联广告代码,自适应网页高度,也就是始终保持在一定调试,这款暂时没有关闭功能。

运行效果截图如下:

JS实现很实用的对联广告代码(可自适应高度)

在线演示地址如下:

具体代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>简洁对联广告代码</title>
<script language="JavaScript" type="text/javascript">
lastScrollY=0;
function heartBeat(){ 
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}
//alert(diffY);
percent=.1*(diffY-lastScrollY); 
if(percent>0)percent=Math.ceil(percent); 
else percent=Math.floor(percent); 
document.getElementById("lovexin12").style.top=parseInt(document.getElementById
("lovexin12").style.top)+percent+"px";
document.getElementById("lovexin14").style.top=parseInt(document.getElementById
("lovexin12").style.top)+percent+"px";
lastScrollY=lastScrollY+percent; 
//alert(lastScrollY);
}
suspendcode12="<DIV id=\"lovexin12\" style='left:2px;POSITION:absolute;TOP:120px;'>ad1</div>"
suspendcode14="<DIV id=\"lovexin14\" style='right:2px;POSITION:absolute;TOP:120px;'>ad2</div>"
document.write(suspendcode12); 
document.write(suspendcode14); 
window.setInterval("heartBeat()",1);
</script>
<style type="text/css">
<!--
#lovexin12,#lovexin14{
width:100px;
height:230px;
background-color:yellow;
border:2px solid red;
}
html,body{
height:800px;
}
#mm{
height:800px;
}
-->
</style>
</head>
<body>
<div id="mm">
基于JS+CSS+DIV的网页对联广告代码
</div>
</body>
</html>

希望本文所述对大家的JavaScript程序设计有所帮助。

Javascript 相关文章推荐
网页中CDATA标记的说明
Sep 12 Javascript
利用javascript实现全部删或清空所选的操作
May 27 Javascript
基于Bootstrap+jQuery.validate实现表单验证
May 30 Javascript
老生常谈JavaScript中的this关键字
Oct 01 Javascript
js实现获取鼠标当前的位置
Dec 14 Javascript
js实现炫酷的左右轮播图
Jan 18 Javascript
js禁止Backspace键使浏览器后退的实现方法
Sep 01 Javascript
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
layui动态绑定事件的方法
Sep 20 Javascript
js+canvas实现转盘效果(两个版本)
Sep 13 Javascript
vue使用exif获取图片旋转,压缩的示例代码
Dec 11 Vue.js
教你使用vscode 搭建react-native开发环境
Jul 07 Javascript
jQuery实现可用于博客的动态滑动菜单完整实例
Sep 17 #Javascript
jquery实现仿Flash的横向滑动菜单效果代码
Sep 17 #Javascript
JS实现带关闭功能的阿里妈妈网站顶部滑出banner工具条代码
Sep 17 #Javascript
JQuery标签页效果的两个实例讲解(4)
Sep 17 #Javascript
JS实现具备延时功能的滑动门菜单效果
Sep 17 #Javascript
JQuery菜单效果的两个实例讲解(3)
Sep 17 #Javascript
jQuery实现可编辑的表格实例讲解(2)
Sep 17 #Javascript
You might like
模仿OSO的论坛(一)
2006/10/09 PHP
web目录下不应该存在多余的程序(安全考虑)
2012/05/09 PHP
php中将html中的br换行符转换为文本输入中的换行符
2013/03/26 PHP
destoon后台网站设置变成空白的解决方法
2014/06/21 PHP
yii2 页面底部加载css和js的技巧
2016/04/21 PHP
jquery Ajax 实现加载数据前动画效果的示例代码
2014/02/07 Javascript
jQuery添加和删除指定标签的方法
2015/12/16 Javascript
jQuery1.9+中删除了live以后的替代方法
2016/06/17 Javascript
JavaScript中对象的不同创建方法
2016/08/12 Javascript
AngularJS 执行流程详细介绍
2016/08/18 Javascript
jQuery插件WebUploader实现文件上传
2016/11/07 Javascript
JavaScript this指向相关原理及实例解析
2020/07/10 Javascript
[06:04]DOTA2国际邀请赛纪录片:Just For LGD
2013/08/11 DOTA
Python socket.error: [Errno 98] Address already in use的原因和解决方法
2014/08/25 Python
python验证码识别的实例详解
2016/09/09 Python
Python实现确认字符串是否包含指定字符串的实例
2018/05/02 Python
Python字符串匹配之6种方法的使用详解
2019/04/08 Python
python实现在函数中修改变量值的方法
2019/07/16 Python
wxPython实现整点报时
2019/11/18 Python
Pandas中DataFrame基本函数整理(小结)
2020/07/20 Python
使用Pytorch搭建模型的步骤
2020/11/16 Python
Tuckernuck官网:经典的美国品质服装、鞋子和配饰
2021/01/11 全球购物
介绍一下Java中标识符的命名规则
2014/02/03 面试题
一封普通求职者的求职信
2013/11/20 职场文书
写给爸爸的道歉信
2014/01/15 职场文书
门诊手术室工作制度
2014/01/30 职场文书
工商局副局长个人对照检查材料
2014/09/25 职场文书
党的群众路线教育实践活动制度建设计划
2014/11/03 职场文书
2014年初一班主任工作总结
2014/11/08 职场文书
2014年学生党支部工作总结
2014/12/20 职场文书
综合管理员岗位职责
2015/02/11 职场文书
收银员岗位职责范本
2015/04/07 职场文书
2019年让高校“心动”的自荐信
2019/03/25 职场文书
JavaScript控制台的更多功能
2021/04/28 Javascript
Python趣味实战之手把手教你实现举牌小人生成器
2021/06/07 Python
Python中非常使用的6种基本变量的操作与技巧
2022/03/22 Python