只在html5里遇到，html4没事；拿出来聊聊，路过帮忙解答下！！！

不正常的

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>浮动广告</title>
<script type="text/javascript">
var advInitTop=0;
var closeInitTop=0;
function init(){
advInitTop=parseInt(document.getElementById("advLayer").style.top.slice(0, -2));
closeInitTop=parseInt(document.getElementById("closeLayer").style.top.slice(0, -2));
}
function move(){
//控制广告图片总位于页面顶端左边位置
document.getElementById("advLayer").style.top=advInitTop+document.body.scrollTop;
//控制关闭图片总位于页面顶端左边位置
document.getElementById("closeLayer").style.top=closeInitTop+document.body.scrollTop;
}
function closeMe(){
//关闭“关闭图片”所在的层
document.getElementById("closeLayer").style.display="none";
//关闭“广告图片”所在的层
document.getElementById("advLayer").style.display="none";
}
//当页面拖动滚动条时调用move()函数
window.onscroll=move;
</script>
</head>

<body onLoad="init()">
<div id="closeLayer" onClick="closeMe()" style="position:absolute; left:16px; top:200px;width:31px; height:31px; z-index:2;">
<img src="img/close.png" width="30" height="30"></div>
<p><img src="img/2.jpg" width="1000" height="4700"></p>
<div id="advLayer" style="position:absolute; left:16px; top:200px; width:250px; height:180px; z-index:1;"><a href="http://www.baidu.com">
<img src="img/timg.jpg" width="250" height="180" border="0"></a></div>

</body>
</html>

正常的（注释了<!doctype html>）

--<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>浮动广告</title>
<script type="text/javascript">
var advInitTop=0;
var closeInitTop=0;
function init(){
advInitTop=parseInt(document.getElementById("advLayer").style.top.slice(0, -2));
closeInitTop=parseInt(document.getElementById("closeLayer").style.top.slice(0, -2));
}
function move(){
//控制广告图片总位于页面顶端左边位置
document.getElementById("advLayer").style.top=advInitTop+document.body.scrollTop;
//控制关闭图片总位于页面顶端左边位置
document.getElementById("closeLayer").style.top=closeInitTop+document.body.scrollTop;
}
function closeMe(){
//关闭“关闭图片”所在的层
document.getElementById("closeLayer").style.display="none";
//关闭“广告图片”所在的层
document.getElementById("advLayer").style.display="none";
}
//当页面拖动滚动条时调用move()函数
window.onscroll=move;
</script>
</head>

<body onLoad="init()">
<div id="closeLayer" onClick="closeMe()" style="position:absolute; left:16px; top:200px;width:31px; height:31px; z-index:2;">
<img src="img/close.png" width="30" height="30"></div>
<p><img src="img/2.jpg" width="1000" height="4700"></p>
<div id="advLayer" style="position:absolute; left:16px; top:200px; width:250px; height:180px; z-index:1;"><a href="http://www.baidu.com">
<img src="img/timg.jpg" width="250" height="180" border="0"></a></div>

</body>
</html>

记一次奇葩事——html5可能不支持window.onscroll函数的更多相关文章

  1. Google 做过的 12 件奇葩事

    Google做了太多伟大的事情了.以至于有时它有点让人难以实时跟上它的动态.假设你对这家公司略微有点感情.看看他们做过的一些有点匪夷所思的事儿,可能认为,毕竟是大公司.还挺难以被全然理解透的. 一个Q ...

  2. html5中不再支持的元素

    html5中不再支持的元素:1.acronym(建议abbr) : 定义首字母缩写2.applet(建议object): 定义 applet3.basefont(使用css控制)4.big(使用css ...

  3. [HTML5] 让IE支持HTML5的方法

    越来越多的站点开始使用 HTML5 标签,但是目前的情况是还有很多人在使用IE6.IE7.IE8.为了让所有浏览者都可以正常的访问,解决方案有下面两个: 1.为网站创建多套模板,通过程序对User-A ...

  4. KB奇遇记(5)：奇葩的用人制度

    8月份入职,公司不给我们正式任命,导致了我们开展工作困难重重,基本上很少有人会鸟你,做事仿佛名不正言不顺.哪怕你是未来信息部的老大也一样,网管们根本不买你的账.所以做ERP选型,做旧OA的选型以及加密 ...

  5. java web开发中的奇葩事web.xml中context-param中的注释

    同事提交了代码.结果除同事之外,其他人全部编译报错.报错说web.xml中配置的一个bean 没有定义.按照报错提示,各种找,无果. 由于代码全部都是提交到svn主干,之前也没有做过备份,只能一步一步 ...

  6. HTML5的浏览器支持方案

    现代的浏览器基本都支持 HTML5,此外还有老浏览器. 不管是旧的还是最新的,HTML5对无法识别的元素会作为内联元素自动处理. 所以,在这里教大家怎么让浏览器去处理"未知"的HT ...

  7. HTML5 中canvas支持触摸屏的签名面板

    1.前言 最近实在是太忙了,从国庆之后的辞职,在慢慢的找工作,到今天在现在的这家公司上班大半个月了,太多的心酸泪无以言表,面试过程中,见到的坑货公司是一家又一家,好几家公司自己都只是上一天班就走了,其 ...

  8. 检测浏览器对HTML5和CSS3支持情况的利器——Modernizr

    Modernizr是什么? Modernizr 是一个用来检测浏览器功能支持情况的 JavaScript 库. 目前,通过检验浏览器对一系列测试的处理情况,Modernizr 可以检测18项 CSS3 ...

  9. HTML5 的绘图支持- canvas

    Canvas HTML5新增了一个canvas元素,它是一张空画布,开发者需要通过JavaScript脚本进行绘制. 在canvas上绘图,经过如下3步 (1) 获取canvas元素对应的DOM对象. ...

随机推荐

  1. Directx教程(23) 简单的光照模型(2)

    原文:Directx教程(23) 简单的光照模型(2)    在工程myTutorialD3D11_16中,我在文件light.vs中定义了一个材质光源属性常量缓冲. //const buffer最好 ...

  2. LeetCode172 Factorial Trailing Zeroes. LeetCode258 Add Digits. LeetCode268 Missing Number

    数学题 172. Factorial Trailing Zeroes Given an integer n, return the number of trailing zeroes in n!. N ...

  3. Chef 安装

    http://www.tuicool.com/articles/RnAVn2 三个角色: chef server, chef workstation, chef nodes(chef clients) ...

  4. day4_python-之装饰器、迭代器、生成器

    一.装饰器 1.为何要用装饰器 #开放封闭原则:对修改封闭,对扩展开放 2. 什么是装饰器 装饰器他人的器具,本身可以是任意可调用对象,被装饰者也可以是任意可调用对象. 强调装饰器的原则:1 不修改被 ...

  5. mysql 语句的查询过程解析

    select * from tb where ID = 1 下面解析的查询过程都是基于上面的简单查询,该系列的所有素材都来自于丁奇的mysql的45讲 1.建立连接 a.客户端发出请求,请求首先到达连 ...

  6. Java Annotation入门

    Java Annotation入门作者:cleverpig 版权声明:本文可以自由转载,转载时请务必以超链接形式标明文章原始出处和作者信息及本声明作者:cleverpig(作者的Blog:http:/ ...

  7. Person Re-identification 系列论文笔记（四）：Re-ID done right: towards good practices for person re-identification

    Re-ID done right: towards good practices for person re-identification Almazan J, Gajic B, Murray N, ...

  8. 【BootStrap】--具有增删改查功能的表格Demo

    [BootStrap]--具有增删改查功能的表格Demo 目录(?)[+] 前言 版本一 样式 代码 版本二 样式 代码 版本三 样式 代码 总结 前言 bootstrap的表格样式,有类似EasyU ...

  9. 基于Qt框架的GUI控制台——qtconsole

  10. SDUT-3441_数据结构实验之二叉树二：遍历二叉树

    数据结构实验之二叉树二:遍历二叉树 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 已知二叉树的一个按先序遍历输入的字符 ...