简单的javascript实例二(随页面滚动广告效果)
方便以后copy
页面代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="css/css.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="js/js.js"></script>
</head>
<body>
<div id="main">
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/>
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/>
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/>
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/>
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/>
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/>
<br/><br/><br/>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试<br/><br/><br/> </div>
<div id="ads">
广告广告广告广告广告广告广告广告广告广告<br/>
广告广告广告广告广告广告广告广告广告广<br/>
广告广告广告广告广告广告广告广告广告广告广告广告
</div>
</body>
</html>
js代码
var adsTop = 150;
function testPosition(){
var divAds = document.getElementById("ads");
var sTop1 = document.body.scrollTop;
var sTop2 = document.documentElement.scrollTop;
var sTop = (sTop1>sTop2)?sTop1:sTop2;
var aTop = adsTop+sTop;
divAds.style.top=aTop+"px";
}
window.onscroll=testPosition;
简单的javascript实例二(随页面滚动广告效果)的更多相关文章
- ScrollMagic – 酷毙了！超炫的页面滚动交互效果
ScrollMagic 是一款 jQuery 插件,它让你可以像使用进度条一样使用滚动条.如果你想在特定的滚动位置开始一个动画,并且让动画同步滚动条的动作,或者把元素粘在一个特定的滚动位置,那么这款插 ...
- 一个简单的JavaScript实例
1 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&q ...
- Javascript实例技巧精选(6)—滚动鼠标中键读取Json数据分页显示网页内容
>>点击这里下载完整html源码<< 截图如下: 滚动鼠标中键读取Json数据分页显示网页内容,关键的Javascript如下: <script type="t ...
- 简单的javascript实例一(时钟特效)
方便以后copy 时钟特效 <html> <head> <meta http-equiv="Content-Type" content="t ...
- jQuery插件实例三：图片滚动[切换]效果一
图片切换效果在很多网站上都能看到,是一种常见的广告/活动宣传方式,通常位于网页上端.这个插件是众多图片切换效果的形式中的一种,数据源可在前端配置,也可从后台通JSON格式传输数据,当然,数据格式是固定 ...
- js原生 + jQuery实现页面滚动字幕
js原生/jQuery实现页面滚动字幕效果 17:45:49 在新闻列表或者文章列表信息等页面中很容易要求实现字幕滚动的效果,以下为简单的实现页面中滚动字幕的效果 1.jQuery实现页面滚动字幕效果 ...
- 一天JavaScript示例-判定web页面的区域
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 二、JavaScript语言--JS实践--信息滚动效果制作
运用JavaScript技术,掌握无缝滚动和歇间性滚动的制作方法. 一.marquee标签实现信息滚动 1 behavior滚动的方式 alternate:表示在两端之间来回滚动 scroll:表示由 ...
- Page Scroll Effects - 简单的页面滚动效果
Codyhouse 收集了一组页面滚动效果,就是目前大家很常见的用户在浏览网页的时候.一些效果虽然极端,但如果你的目标是创建一个身临其境的用户体验,他们是非常有用的.所有的动画都使用 Velocity ...
随机推荐
- 【转载】ADO.NET与ORM的比较(4):EntityFramework实现CRUD
[转载]ADO.NET与ORM的比较(4):EntityFramework实现CRUD 说明:个人感觉在Java领域大型开发都离不了ORM的身影,所谓的SSH就是Spring+Struts+Hiber ...
- 如何循序渐进有效学习 JavaScript？
著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处.作者:宋学彦链接:http://www.zhihu.com/question/19713563/answer/23068003来源: ...
- VS2010无法断点调试解决办法
今天我的VS2010忽然出现设置断点的时候,无法进行调试.现象:每次在设置断点调试的时候都会出现卡机,然后VS弹出如下图所示的状况: 解决办法: 依次点击:“工具-->扩展管理器”然后找到.Ne ...
- python中print后面加逗号
python中print输出一行,如果想多次输出的内容不换行,可以在print后面加逗号 例如 每个输出一行 phrase = "abcdefg" # Add your for l ...
- 在Git中一定要关注的crlf自动转换
GitHub 第一坑:换行符自动转换 如果你已经做出了错误的选择,也不需要重新安装,可以直接使用命令行来修改设置.很简单,直接打开这货自带的命令行工具 Git Bash,输入以下命令,再敲回车即可: ...
- vs 2013打开vs 2008解决方案问题解决
同时安装了vs 2013和vs 2008后,双击vs 2008的解决方案,会出现直接用vs 2013打开的问题. 解决以上问题: 右键选择VS 2008的解决方案,选择开发方式->选择默认程序, ...
- DOSUSB 2.0 免费版的限制原理
两年前,我在写USB的文章时,多次提到了DOSUSB这个东东,这两年也没有关注这方面的变化,最近,有机会重新进入DOSUSB的官方网站(www.dosusb.net),欣喜地发现,这个网站不仅依然存在 ...
- 汇编写函数:关于PUBLIC和EXTRN的区别
PUBLIC伪指令的格式:PUBLIC 标识符,标识符... 该伪指令告诉汇编程序放在PUBLIC之后的标识符(本模块的定义的)可为其他模块使用,这些标识符可以是变量.标号或者过程名.言外之意,它不仅 ...
- Qt 自定义事件详细实例（继承QEvent，然后QCoreApplication::postEvent()、sendEvent()）
创建用户事件 创建一个自定义类型的事件,首先需要有一个事件号,其值通常大于QEvent::User.为了传递事件信息,因此必须编写自定义的事件类,该事件类从QEvent继承. 编写用户事件:编写用户事 ...
- jQuery之事件
(一).事件列表. 1.blur() 当失去焦点时触发.包括鼠标点击离开和TAB键离开. 2.change() 当元素获取焦点后,值改变失去焦点事触发. 3.click() 当鼠标单击时触发. 4.d ...