只在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. 发布网站时 遇到XX类型 同时存在XX.dll和XX.dll中

    遇到该问题的可能如下: 1.复制了页面 更改了名字 可是对应的一些地方没有注意 <%@ Page Language="C#" AutoEventWireup="tr ...

  2. 【C++】关于map的遍历 删除

    int main(int argc, char* argv[]) { map<string, string> mapData; mapData["a"] = " ...

  3. Map容器案例

    案例讲解  --统计字符串出现的次数 package com.date; import java.util.HashMap; import java.util.Map; import java.uti ...

  4. 【转载】使用 gnuplot 在网页中显示数据

    来源:http://www.ibm.com/developerworks/cn/aix/library/au-gnuplot/ 简介 gnuplot 是一个用于生成趋势图和其他图形的工具.它通常用于收 ...

  5. IDI Open 2016 H 字符串模拟题

    H - Palindrome Names 题意:给定一个字符串,每次可以向末尾添加一个字符或者更改一个字符.求使得字符串为回文串(从前往后和从后往前读一样)所花费的最小步数. 题解: 看来需要多思考啊 ...

  6. @codechef - MGCH3D@ 3D Queries

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 在三维空间内有 N 个不同的点,请计算下面式子的值 Q 次: \ ...

  7. laravel拓展validator验证

    https://blog.csdn.net/zl20117/article/details/53536520 首先,扩展的收个问题是,我的扩展类应该放在哪儿才好呢? 直接在app目录下,建立一个目录: ...

  8. H3C 路由器SSH服务配置命令(续)

  9. Serverless助力AI计算:阿里云ACK Serverless/ECI发布GPU容器实例

    ACK Serverless(Serverless Kubernetes)近期基于ECI(弹性容器实例)正式推出GPU容器实例支持,让用户以serverless的方式快速运行AI计算任务,极大降低AI ...

  10. XTU 1236 Fraction

    Fraction Accepted : 168   Submit : 1061 Time Limit : 1000 MS   Memory Limit : 65536 KB Fraction Prob ...