2013年6月13日

Web前端优化

摘要: 一、HTML优化1、避免使用iframe,iframe又叫做内联frame。可以将一个HTML文档嵌套到另一个HTML文档里面。iframe的好处是:嵌入的文档独立于父文档,通常也借此使浏览器模拟多线程。缺点是:(1)虽然iframe能够模拟多线程,但是主流浏览器的同域名并行下载数是不变的。(2)在页面加载时,iframe会阻碍父文档的onload事件的触发。(3)iframe开销昂贵2、避免空连接属性空连接指:img、link、script和iframe元素的src或href属性的值为空。(如src=””)设置了空连接后浏览器依然会以默认规则发送请求: ①IE6~8中只有img元素会出问题. 阅读全文

posted @ 2013-06-13 16:07 Zarah 阅读(126) 评论(0) 推荐(0) 编辑

2013年3月30日

jQuery学习教程——入门

摘要: 想要结构与行为分离就不能使用类似<button onclick="…"></button>的东西了,所以就产生了jQuery颇具创意的$(document).ready(function(){})还可以更加精简:$(function (){});jQuery对象的方法和DOM对象的方法是不能混合使用的。例如$("id").innerHTML()和document.getElementById("id").html()都是错误的。jQuery对象和DOM对象的转换,jQuery选择器返回的对象实则是以对象数组的方 阅读全文

posted @ 2013-03-30 11:21 Zarah 阅读(112) 评论(0) 推荐(0) 编辑

2013年3月19日

document

摘要: document子对象概述Document子对象包括body主体对象、location位置对象、selection选区对象、Link链接对象、Anchor锚点对象、Image图像对象和form表单对象。body主体子对象的参数如下:document.body.innerText:设置HTML文档主题中的文本document.body.innerHTML:设置HTML文档主体中的HTML代码document.body.topMargin:设置HTML文档主体中页面的上边距document.body.leftMargin:设置HTML文档主体中的左边距document.body.rightMarg 阅读全文

posted @ 2013-03-19 20:48 Zarah 阅读(256) 评论(0) 推荐(0) 编辑

2013年3月15日

previousSibling

摘要: previousSibling 属性可返回某节点之前紧跟的节点(处于同一树层级)如果没有此节点,那么该属性返回 null。语法:nodeObject.previousSibling例子:<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <script type="text/javascript"> function test(str){ alert(str); } </script>& 阅读全文

posted @ 2013-03-15 17:52 Zarah 阅读(222) 评论(0) 推荐(0) 编辑

2013年3月14日

利用Javascript制作Tab面板

摘要: <!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><meta http-equiv="Content-Type" content="text/html; charset=gb23 阅读全文

posted @ 2013-03-14 21:27 Zarah 阅读(167) 评论(0) 推荐(0) 编辑

动态变色的表格

摘要: <!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><meta http-equiv="Content-Type" content="text/html; charset=gb23 阅读全文

posted @ 2013-03-14 09:14 Zarah 阅读(195) 评论(0) 推荐(0) 编辑

2013年3月4日

制作固定宽度的表格

摘要: 如果不定义表格中每个单元格的宽度,当向单元格中插入网页元素时,表格往往会变形。这样无法利用表格精确定位网页中的元素,网页中会有很多不必要的空隙,使网页显得不紧凑也不美观,因此要利用固定宽度的表格和单元格精确地包含住其中的内容。制作固定宽度的表格通常有一下两种方法。(1)定义所有列的宽度,但不定义整个表格的宽度。例如:<tableborder="0"cellpadding="0"cellspacing="0"><tr><tdwidth="200"></td><td 阅读全文

posted @ 2013-03-04 23:46 Zarah 阅读(203) 评论(0) 推荐(0) 编辑

跑马灯标记<marquee></marquee>

摘要: <marquee>是一个有趣的标记,它能使其中的文本(也可以是图像)在浏览器屏幕上不断滚动。其中behavior="alternate"设置滚动方式为来回滚动,设置为scroll表示循环滚动,设置为"slide"表示滚动到目的地就停止。Direction属性用于控制滚动的方向,可以上下滚动或左右滚动。Loop设置滚动的次数,loop为0表示不断滚动。Scrollamount属性设置滚动的速度。Scrolldelay属性设置滚动的延时。例如下面的代码能使标记中的内容从下到上循环滚动,并且当鼠标停留(ommouseover事件)在文本上时,文本会 阅读全文

posted @ 2013-03-04 23:44 Zarah 阅读(278) 评论(0) 推荐(0) 编辑

2013年3月3日

制作跟随鼠标移动的图片放大效果

摘要: 本例中,当鼠标滑动到某张图片上时,鼠标的旁边就会显示这张图片的放大图片,而且放大的图片会跟随鼠标移动。在整个例子中原图和放大的图片都采用的是同一张图片,只不过对原图设置了width和height属性,使它缩小显示,而放大图片就显示图片的真实大小。制作步骤如下:(1)把几张要放大的图片放到一个div容器中,然后再添加一个div的空容器用来放置当鼠标经过时显示的放大图像。结构代码如下:<div id="demo"> <img src="images/pr_l_1.jpg" /><img src="images/pr_l 阅读全文

posted @ 2013-03-03 21:01 Zarah 阅读(1096) 评论(1) 推荐(0) 编辑

事件对象——IE和DOM中的事件对象

摘要: 事件在浏览器中是以对象的形式存在的,在IE中,事件(event)又是window对象的一个属性event,因此访问时通常采用如下方法:oP.onclick=function(){var oEvent=window.event;}尽管它是window的属性,但event对象还是只能在事件发生时被访问,所有的事件处理函数执行完成之后,改对象就自动消失了。而标准DOM中规定event对象必须作为唯一的参数传递给事件处理函数,因此在类似FireFox浏览器中访问事件对象通常将其作为参数,代码如下:oP.onclick=function(oEvent){}因此为了兼容这两种浏览器,通常采用下面的方法。o 阅读全文

posted @ 2013-03-03 16:22 Zarah 阅读(163) 评论(0) 推荐(0) 编辑

导航