- 浏览: 602611 次
- 性别:
- 来自: 杭州,长沙
文章分类
- 全部博客 (279)
- Java (30)
- Jsp、Servlet (18)
- Web前端 (56)
- Oracle (31)
- SqlServer (1)
- Jetty (3)
- Tomcat (6)
- Weblogic (11)
- Websphere (2)
- Struts2 (13)
- Spring (5)
- Ibatis (8)
- Hibernate (3)
- Webservice (1)
- C/C++ (2)
- Linux (13)
- Android (1)
- 正则表达式 (3)
- 网络组建 (3)
- 软件工程 (11)
- IDE使用技巧 (20)
- Windows操作技巧 (18)
- 养生之道 (1)
- 杂七杂八 (15)
- 心理保健 (1)
最新评论
-
50854319:
elements[i] = tagArr[i]; 这个需要修改 ...
document.getElementsByName在IE下的bug解决 -
mengsina:
通过楼主的介绍,能够启动client了。但是又遇到了cisco ...
(转)Cisco Systems, Inc. VPN使用过程中常见问题解决方案 -
zzz_robinson:
谢谢,关闭-启动-启动。这个循序对的,否则每次都提示服务没打开 ...
(转)Cisco Systems, Inc. VPN使用过程中常见问题解决方案 -
wuchunjiesp:
总算解决了,THANK楼主,空值问题是TYPE里面参数类型定义 ...
(原创)Ibatis2调用数据库存储过程的相关示例 -
wuchunjiesp:
存储里面是这样的
FOR I IN 1..P_GOODSDI ...
(原创)Ibatis2调用数据库存储过程的相关示例
代码: inputImage方法是把一张图片插入一个Div中: 这种情况用第三节的结论很容易说明:在<script>inputImage("script2", "images/Script2.JPG")</script>处,先执行脚本,加载图片Script2,然后加载在Script2之前的图片Css5(Css5是在外部Css文件中声明的,修饰的是cssContainer1的背景图片,由于后面还有内联的Style,所以这里Css5被IEAbort了)以及Css2,之后执行<script>inputImage("script1", "images/Script1.JPG")</script> 加载图片Script1,然后加载在Script1之前的图片Css3。接下来顺序加载内嵌图片以及背景图片。 FF3.0+Firebug 这里可以看到与IE不同,Firefox是先加载背景图片再加载脚本插入的图片。结合第三节,可以认为Firefox把脚本插入的图片和背景图片作为相同加载顺序权值的图片看待,它们之间的加载顺序按照在页面上出现的先后安排。 但有时在IE下会出现下面的情况: 这是什么原因呢? 第二段代码: 这里onload闪亮登场,看表现: FF3.0+Firebug 很明显,放在onload事件里加载的图片被放在最后才加载,这也很好理解。 IE7+HttpWatch: IE表现出了多样性,不得不认为,对于IE来说,Script标签是个不稳定因素,它的影响是确定的,但影响的结果是不定的……4.下面我们试试用Javascript插入图片
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>测试图片加载顺序</title>
<link rel="stylesheet" href="css/style.css" />
<script src="script/main.js"></script>
</head>
<body>
<div id="div1">
<img src="images/Div1.jpg" /></div>
<div id="div2">
<img src="images/Div2.jpg" /></div>
<div id="div3">
<img src="images/Div3.jpg" /></div>
<div id="script1">
</div>
<div id="script2">
</div>
<div>
<div id="cssContainer1">
<div id="cssContainer2" style="background-image: url('images/Css2.jpg')">
</div>
<script>inputImage("script2", "images/Script2.JPG")</script>
<div id="cssContainer3">
</div>
<script>inputImage("script1", "images/Script1.JPG")</script>
</div>
<div id="cssContainer4" style="background-image: url('images/Css4.jpg')">
</div>
<div id="div4">
<img src="images/Div4.jpg" /></div>
</div>
<div id="div5">
<img src="images/Div5.jpg" /></div>
<div id="div6">
<img src="images/Div6.jpg" /></div>
<div id="div7">
<img src="images/Div7.jpg" /></div>
<div id="div8">
<img src="images/Div8.jpg" /></div>
<div id="div9">
<img src="images/Div9.jpg" /></div>
<div id="div10">
<img src="images/Div10.jpg" /></div>
<div id="div11">
<img src="images/Div11.jpg" /></div>
<div id="div12">
<img src="images/Div12.jpg" /></div>
<style>
#cssContainer1
{
background-image: url("images/Css1.jpg");
}
</style>
</body>
</html>
function inputImage(divid, imgpath) {
var divImage = document.getElementById(divid);
divImage.innerHTML = '<img src="' + imgpath + '" />';
}
IE7+HttpWatch:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>测试图片加载顺序</title>
<link rel="stylesheet" href="css/style.css" />
<script src="script/main.js"></script>
</head>
<body>
<div id="div1">
<img src="images/Div1.jpg" /></div>
<div id="div2">
<img src="images/Div2.jpg" /></div>
<div id="div3">
<img src="images/Div3.jpg" /></div>
<div id="script1">
</div>
<div id="script2">
</div>
<div>
<div id="cssContainer1">
<div id="cssContainer2" style="background-image: url('images/Css2.jpg')">
</div>
<script>inputImage("script2", "images/Script2.JPG")</script>
<div id="cssContainer3">
</div>
</div>
<div id="cssContainer4" style="background-image: url('images/Css4.jpg')">
</div>
<div id="div4">
<img src="images/Div4.jpg" /></div>
</div>
<div id="div5">
<img src="images/Div5.jpg" /></div>
<script>window.onload = function() { inputImage("script1", "images/Script1.JPG"); }</script>
<div id="div6">
<img src="images/Div6.jpg" /></div>
<div id="div7">
<img src="images/Div7.jpg" /></div>
<div id="div8">
<img src="images/Div8.jpg" /></div>
<div id="div9">
<img src="images/Div9.jpg" /></div>
<div id="div10">
<img src="images/Div10.jpg" /></div>
<div id="div11">
<img src="images/Div11.jpg" /></div>
<div id="div12">
<img src="images/Div12.jpg" /></div>
<style>
#cssContainer1
{
background-image: url("images/Css1.jpg");
}
</style>
</body>
</html>
发表评论
-
List of mine types
2010-08-03 18:44 1324List of mine types &qu ... -
document.getElementsByName在IE下的bug解决
2010-06-17 09:23 3767那天封装一个ajax边输入边提示标签,在JS脚本中使用到了do ... -
JS文件中获取contextPath的方法
2010-06-11 15:48 3097function getContextPath() { ... -
javascript获取当前鼠标在屏幕上的会标(转)
2010-06-11 14:35 990<script>function mouseMov ... -
HTML页面元素加载顺序研究报告(5)----Script标签在Firefox下对背景图片的影响
2010-06-09 13:09 2208在上一节中发现,背景图片似乎还有些需要研究的地方。 代码 ... -
HTML页面元素加载顺序研究报告(3)----Script标签与背景图片(转)
2010-06-09 12:08 23413、看下Javascript对图片加载顺序的影响 采用和 ... -
HTML页面元素加载顺序研究报告(2)----背景图片(转)
2010-06-09 11:39 26532、接下来考察背景图片的加载: 一般来说,添加背景图片有 ... -
HTML页面元素加载顺序研究报告(1)----简单Div罗列(转)
2010-06-09 11:37 1874一直没有意识到HTML页面的元素加载顺序有什么重要性,至多 ... -
提高网站访问速度的34条军规二 (转)
2010-06-09 11:32 92718 预先加载组件 (Preload ... -
提高网站访问速度的34条军规一 (转)
2010-06-09 11:28 13051 减少HTTP请求数量 (Minimize HTTP Req ... -
JavaScript输出中文乱码的解决方法
2010-06-08 16:27 1364当页面中包含的js文件中有中文输出时,在页面中会出现乱码. ... -
javascript动态循环添加行及行中的事件调用带参数的函数
2010-06-03 16:33 1935今天在做一个动态循环添加行,并在新行添加onclick事件,调 ... -
(转)a href=#与 a href=javascript:void(0) 的区别
2010-02-23 15:53 2234<a href="#"> 点击 ... -
树型对象的table展现形式思考
2009-10-20 13:57 1019如图所示:近日项目中需要将一个动态树型结构以表格动态合并行 ... -
Javascript实现web表格宽度拖动(分固定宽度和不固定宽度)
2009-06-30 19:47 2034<html><head><tit ... -
JSeclipse最新的update地址
2009-03-30 10:22 1450http://www.interaktonline.com/P ... -
Javascript窗口与提示大全
2009-03-19 15:40 1124//-----------按钮提示框----------// ... -
web标准:div+css命名规则
2009-03-16 11:41 1172SEO(搜索引擎优化)有很多工作要做,其中对代码的优化是一个很 ... -
四种悬浮DIV提示效果
2009-03-11 09:55 7071<html> <head> <t ... -
javascript中数组去除重复值
2008-09-08 19:44 3393<script> Array.prototyp ...
相关推荐
前端项目-javascript-canvas-to-blob,javascript canvas to blob是一个将画布元素转换为blob对象的函数。
卫班科技---JavaScript自动加载定时器,这个是一个页面加载时。自动执行定时器的JavaScript案例。
前端项目-javascript-detect-element-resize,基于事件的跨浏览器元素大小调整检测
Pegasus-Javascript库数据加载速度更快
NULL 博文链接:https://android-zhang.iteye.com/blog/1659943
子元素的margin-top如下html其实我们给子元素设置一个margin-top,是想他相对父层节点顶部偏移20px,但是结果是如图:子层元素没有相父元素去
JavaScript程序构成 4-基于对象的JavaScript语言 5-在JavaScript中创建新对象 6-JavaScript对象系统的使用 7-JavaScript窗口及输入输出 8-用JavaScript脚本实现Web页面信息交互 9-用JavaScript...
h实验八 javascript实验的网页加载进度条(ajax) - 副本
javascript实例应用---页面特效类.rarjavascript实例应用---页面特效类.rarjavascript实例应用---页面特效类.rar
roundcorner.css JavaScript使用CSS模拟图片的圆角效果时使用的CSS样式文件。 第13章(\c13) 示例描述:介绍JavaScript与XML。 13.1.xml 表示书籍信息的XML信息。 13.2.js 跨浏览器兼容的XPath实现。 ...
Html - Css - Javascript - The Web Programmer's Desk Reference
4- JavaScript参考手册中文版.chm 5- Javascript高级教程.CHM 6- JavaScript使用手册.chm 7- 网页制作完全手册.chm 8- 样式表滤镜中文手册.CHM 9- 样式表中文手册2.0.CHM 关于web前端的一些阐述: Web标准是所有...
本文实例为大家分享了JavaScript实现换肤效果的具体代码,供大家参考,具体内容如下 换肤效果:点击不同图片,更换相应页面背景 实现思路 1、定义一组图片,每个src属性赋值背景图片路径 2、获取一组图片元素...
◆使用JS完成图片轮播效果 ◆使用JS完成页面定时弹出广告 ◆使用JS完成表单校验等。 学习目标: ◆掌握JavaScript的基本语法 ◆掌握JavaScript的对象获取 ◆掌握JavaScript标签的基本操作 ◆使用JS可以获得指定元素 ...
超文本 (文字+图片+音视+链接…) 标记语言 (浏览器根据标记显示内容) 来自于SGML(标准通用标记语言) 专注于在Web上传递信息 是写给浏览器的语言 历史 HTML1.0 – HTML2.0 (IETF制定) – HTML4.0(最终版) W3C IETF –...
用途:主要用于远程脚本嵌入,有的时候我们可能需要通过在某些应用中嵌入动态脚本以达到我们想要的数据加载或者一些程序控制,那么JFOREMOTE可能会符合我们这个要求。 通过这个框架可以很快的构成自己远程调用的...
vue loading 页面加载动画提示
javaScript -- 496. 下一个更大元素 I