o仔札记 -- W3C标准下的页面构建

Iframe内容自适应两种方法

o仔 — Mon, 20 Sep 2010 23:21:42 +0800

第1种，都在同一个页面，通过脚本写在当前页面控制加载内容的自适应，这种方法很不错，不过不能兼容apple safari 浏览器。在safari浏览器的第一次加载是可以正常的，如果里面有链接的target也是指向这个iframe ，那么内容就不能自适应，会以第一次加载的高度为准。

第1种：首页加载代码

<script type="text/javascript">
function iframeFitHeight(oIframe)
   {//Iframe窗口自适应高度 兼容 IE6.0 FF2.0以上
 try
    {
       var oWin = oIframe.name ? window.frames[oIframe.name] : oIframe.contentWindow;
       oIframe.style.height = oWin.document.body.scrollHeight + "px";
    }
   catch(e){}
    }
</script>

调用代码用onload函数

 <iframe border="0" frameborder="0" scrolling="no" src="main.html" name="myframe" width="100%" onload="iframeFitHeight(this)"></iframe>

到这里基本可以支持主流浏览器除了safari。
解决办法就是在每点击一次，load一次内容并且重新赋予内容的高度给予父层的iframe，因此下面的代码一样需要加载在首页。

/* 修复safari内部链接点击 */
$(function(){
    $("#mainframe").load(function(){
        var height = $(this).contents().find("#contenter").height() + 40;
//这样给以一个最小高度
        $(this).height( height < 400 ? 400 : height );
    });
});

第2种：
这种需要把脚本代码放到准备加载到iframe的内容里。此方法需要页面可以让你更改，因为代码需要加载在目标的内容里。不过一样不兼容safari的第二次点击。

main.htm: 想要在这个页面显示iframe的内容的页面。

<html>
    <head>
       <meta  http-equiv='Content-Type'  content='text/html;  charset=gb2312' />
       <meta  name='author'  content='F.R.Huang(meizz梅花雪)//www.meizz.com' />
       <title>iframe自适应加载的页面高度</title>
    </head>  

    <body>
        <iframe src="child.htm"></iframe>
    </body>
</html>

child.htm:要加载自适应的网页

<html>
<head>
    <meta  http-equiv='Content-Type'  content='text/html;  charset=gb2312' />
    <meta  name='author'  content='F.R.Huang(meizz梅花雪)//www.meizz.com' />
    <title>iframe  自适应其加载的网页(多浏览器兼容)</title>
    <script type="text/javascript">
    <!--
    function iframeAutoFit()
    {
        var ex;
        try
        {
            if(window!=parent)
            {
                var a = parent.document.getElementsByTagName("IFRAME");
                for(var i=0; i<a.length; i++) //author:meizz
                {
                    if(a[i].contentWindow==window)
                    {
                        var h1=0, h2=0;
                        if(document.documentElement&&document.documentElement.scrollHeight)
                        {
                            h1=document.documentElement.scrollHeight;
                        }
                        if(document.body) h2=document.body.scrollHeight;

                        var h=Math.max(h1, h2);
                        if(document.all) {h += 4;}
                        if(window.opera) {h += 1;}
                        a[i].style.height = h +"px";
                    }
                }
            }
        }
        catch (ex){}
    }
    if(document.attachEvent)
    {
        window.attachEvent("onload",  iframeAutoFit);
        window.attachEvent("onresize",  iframeAutoFit);
    }
    else
    {
        window.addEventListener('load',  iframeAutoFit,  false);
        window.addEventListener('resize',  iframeAutoFit,  false);
    }
    //-->
    </script>
</head>
<body>
    <table border="1" width="200" style="height: 400px; background-color: yellow">
        <tr>
            <td>iframe  自适应其加载的网页(多浏览器兼容，支持XHTML)</td>
        </tr>
    </table>
</body>
</html>

以上两种方法的代码均来自互联网. 部分有注释作者.

让wordpress显示首页index.html

o仔 — Fri, 03 Sep 2010 17:46:08 +0800

假设我有一个网站放在跟wordpress同个目录，需要第一个是显示 index.html 而不是 index.php 这个时候，下面的方法就派得上用场了。如果你的wordpress不介意在二级目录就没这样的烦恼了。

原因：wordpress的index.php 会一直循环调用，如果更改了.htaccess 文件为 index.html 那么日志就会循环调用不出来。

修改首页为.html 需要注意：

1.在wordpress 后台修改永久链接(Permalink Settings)，把default 改为下面哪个都行，根据自己需要（有部分风格会用博客的根目录，这样首页更改了，日志链接就点击不进去了，所以需要修改永久链接）。

会在根目录生成一个.htaccess 文件

2.修改.htaccess 文件，

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

上面的代码会根据自己所选生成，在 # END WordPress 上面增加下面代码

<IfModule dir_module>
   DirectoryIndex index.html index.php
</IfModule>

2.修改rewrite.php文件把index.php 改为你现在的blog 首页，把index.php要复制多一个改名为home.php

wp-includes/rewrite.php

在 515 line.

var $index = 'home.php';

如果更换风格，首页不是.html 那这个要更改回 index.php

3.搜索action的路径需要修改 searchform.php ，因为默认的wordpress 还是以根目录为搜索，所以需要更改为现在的首页。

wp-content\themes\PetakSawah\searchform.php

现在是改到

action="<?php bloginfo('home'); ?>/home.php"

就这样，你的另外的网站首页就可以跟wordpress兼容了。。

让页面绝对水平垂直居中–jquery例子

o仔 — Mon, 23 Aug 2010 11:08:43 +0800

例子的大概的示意图，以例子为准，截得不够绝对居中。

也许你也会用到的一个例子,让页面垂直居中。。如果你的分辨率够高的话，你就会发现很多页面如果不够长，就会全在上面那么一点，下面留了很多空白。。这时候就需要用到垂直居中了。原理很简单，里面都有注释了，就不废话了。。需要就拿去用。。还可以继续扩展下去。。
兼容 firefox ie6以上 chrome opera

<!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" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>绝对垂直居中的例子--http://imouou.com/blog/</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
	<style type="text/css">
		#wrap {height:200px;width:200px;background:#cccccc;position:absolute;}
	</style>
	<script type="text/javascript">
		$(function(){
			function windowalign(){
				var bodyheight = $(document).height(),  //整个网页的宽度 如果这里是window ie6and ie7 得到的是负数
					bodywidth = $(window).width(),  //整个网页的高度 如果这里是document ie7不会水平居中
					wrapwidth = $("#wrap").width(),  //要垂直居中的内容的宽度
					wrapheight = $("#wrap").height();  //要垂直居中的内容的高度度
					postop = (bodyheight-wrapheight)/2;  // 获取顶部的position
					posleft = (bodywidth-wrapwidth)/2;  // 获取左边部的position
					$("#wrap").css({"left":posleft+"px","top":postop+"px"});  // 设置position
			}
			windowalign();
			$(window).resize(function(){  // 当调整窗口的时候动态修正位置
				windowalign();
			});
		})
	</script>
</head>
<body>
	<div id="wrap"></div>
</body>
</html>

随机阅读

National Geographic Flash

o仔 — Sat, 24 Jul 2010 09:22:45 +0800

National Geographic – Ancient Treasure Ships
官方地址：http://ancienttreasureships.com/

这是前段时间跟3个同事一起完成的一个flash整站，整站都是用as2.0完成的。。现在链接的只是主文件，链接不了其它flash，想看完整版的可以打开官方观看。

Epic Voyage 是一个航海旅行的动画，重走当年海上丝绸之路。（丝绸之路是历史上横贯欧亚大陆的贸易交通线，促进了欧亚非各国和中国的友好往来。中国是丝绸的故乡，在经由这条路线进行的贸易中，中国输出的商品以丝绸最具代表性。）

每走到一个地方，都会有一个学习的弹窗，我用loadmovie来分割各种对话框，这样主文件就小很多，减少加载大小，但是糟糕的是，有的弹窗里面还要继续loadmovie，这样 load进来的movie 跟主场景的交互就比较麻烦了……

这条丝绸之路里面用的东西最多，视频的运用，loadmovie的运用，问答题的小游戏，还有拼图的游戏……

Funfacts 里是一个相册类的，还好没有分页。。图片数据都是load外部图片，方便修改。

Exhibition Tour 是一个展馆的介绍，里面的小动画跟弹窗就还简单一些。。

它们之间点击后的转场让我也差点喷血，具体原因跟我里面的布局有关。。现在还有点瑕疵，不过总算通过了！算是我用flash的一个阶段总结吧。

谷歌flash跟踪统计Google Analytics Tracking for Adobe Flash

o仔 — Fri, 02 Jul 2010 18:11:43 +0800

刚刚开发完一个flash整站项目，客户要求要看到用户对flash操作的追踪统计~~囧

http://code.google.com/intl/zh-CN/apis/analytics/docs/tracking/flashTrackingIntro.html

这是官方的使用文档。

我找不到例子，后来找到了教程，做了一个，没啥技术含量，应该会比看官方的省一些时间。目前flash的统计只支持as3，如果你是使用as2的话，就算了，放弃吧。

教程跟例子下载：
Google Analytics for flash教程
 google 的跟踪统计 Flash应用例子

随机阅读

学习jquery笔记(1)

o仔 — Wed, 09 Jun 2010 18:45:07 +0800

最近忙着学习这学习那，很少更新文章了。。在制作的过程中还是遇到了不少以前没遇到过的新鲜的东西。。所以会尝试着把它慢慢整理出来。

下面是我在做jquery 遇到的一些怪异现象。。

jquery学习笔记

1. slideDown(),slideUP(),不支持 tr 的显示隐藏
2.eq() 获取某一个块很重要
3.index() 获取当前第几个返回一个数字
4.fadeOut(),fadeIn(), 淡入淡出，中间参数是数字
5.delay() 延迟中间是数字
6.removeClass(“”),addClass(“”) 添加删除样式
7.return function() 返回一个函数
8. animate() 可以模仿已有任何一种动画，相当强大
9.font-weight:bold;会导致 fadeIn() 出现文本细体到粗体的变化。只在ie下面有。

随机阅读

li 不设高度可能导致ie6 ie7 新问题bug

o仔 — Mon, 26 Apr 2010 20:24:16 +0800

ie6 ie7 效果图错误

firefox ie8效果图正确

如上面的图一样，对比一下你会发现右边标题的地方往下移了 10个像素左右，但是我并没有设置它的margin-top啊，这10个像素左右的位移从哪里来的？我发现只要是块元素才会这样，如果是a标签，或者内联元素，就不会了。那我把h3直接改成 inline 元素，应该就可以了啊，但还是没有解决这个问题。。。。h3自带的边距已经清零了。。最后，竟然是因为

没有给 li 设置高度~~ ，不知道算不算 ie6的一个新bug。。ie7也是同样的效果。。以后切记高度莫忘加啊。。不然出现什么怪异现象只会浪费时间。。还是看代码吧。。

<!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> li没设高度导致h3块元素上面10px左右的边距 o仔札记 http://imouou.com/blog/</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<style>
body,ul,li,h3,p {margin:0;padding:0;font-size:12px;}
.movie_list {height:auto !important;min-height:100px;padding-top:10px;}
.movie_list li {margin:3px 8px;}
.movie_info h3 {width:400px;height:30px;line-height:25px;overflow:hidden;margin:0;padding:0;}
.movie_list li a img{float:left;width:120px;height:146px;padding:2px;border:1px solid #ccc;margin-right:10px;}
.movie_info {color:#666699}
.movie_info strong {color:#666666;font-weight:normal;}
</style>
</head>

<body>
<div class="movie_list">
	<ul>
		<li>
			<a href="#" ><img src="#" alt=""/></a>
			<div class="movie_info">
			<h3><a href="" title="">这个标题在ie6 ie7下会有上面的边距</a></h3>
			<p><strong>影片主演：</strong></p>
			<p><strong>影片类型：</strong></p>
			<p><strong>发行地区：</strong></p>
			<p><strong>发行时间：</strong></p>
			<p><strong>影片备注：</strong></p>
		</li>
	</ul>
</div>
</body>
</html>

mark 说不会出现这样的情况，难道是我浏览器的问题？

再贴一个简单的例子 ,li不设定高度，旁边只要是块元素，像里面的h3就会往下移~~（bs：代码写得比较懒）

<!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> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="#" rel="stylesheet" type="text/css" />
<style>
	body,ul,li,h3 {margin:0;padding:0;}
	a img{width:120px;height:140px;float:left;}
	div {width:200px;border:1px solid #ccc;}
</style>
</head>

<body>
<ul>
<li>
	<a href="#"><img src="#"/></a>
	<div>
		<h3>标题</h3>
	</div>
</li>
</ul>
</body>
</html>

原来真不是li的问题，是因为 div .movie_info 没有跟着往左 float 导致的。。当然设置 li高度也可以解决这个问题。而且这个高度是加比较好，如果你要设li的下边框，没有高度是不行的~~

loading条实现空间占用百分比的CSS

o仔 — Mon, 26 Apr 2010 10:21:20 +0800

loading空间占用百分比 CSS制作，这个有人也会用于页面加载时候使用。

比较常用于推荐，等级，满意度调查之类的

<!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> o仔札记--http://imouou.com/blog/</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="editplus" />
<style>
	.bar {padding:2px;width:100px;height:8px;border:1px solid #cccccc;}
	.loading {background:#999999;height:8px;width:30%}
</style>
</head>

<body>
	<!--进度条空间占用百分比-->
	<div class="bar">
		<div class="loading"></div>
	</div>
</body>
</html>

loading 百分百条的实现：我们只要获得目前下载的页面大小，除以页面的文件大小，乘以100就可以得到页面的loading进度了，一般页面都是比较小，所以用到也比较少，常用于flash的加载，网页上面的应用，更多的是占用百分比，像QQ的相册空间，给你16Ｍ大小，你目前的用了多少，那只要得到这个比例，控制好 loading的 width 等于百分几，就可以轻松实现了。

上面是一种方法，还有一种比较蠢的方式，就是把百分比切成10块，然后每一个css就控制它百分之10，如果精确到百分之1，那就有得切了，呵呵，所以这种方法一般用来做等级，推荐度~~

<!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> o仔札记--http://imouou.com/blog/</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="editplus" />
<style>
	#star {background:url(images/star.jpg) no-repeat;height:16px;width:70px;}
	.star1 {background:url(images/star.jpg) 0 -18px no-repeat;height:16px;width:70px;}
	.star2 {background:url(images/star.jpg) 0 -34px no-repeat;height:16px;width:70px;}
	.star3 {background:url(images/star.jpg) 0 -52px no-repeat;height:16px;width:70px;}
	.star4 {background:url(images/star.jpg) 0 -70px no-repeat;height:16px;width:70px;}
	.star5 {background:url(images/star.jpg) 0 -85px no-repeat;height:16px;width:70px;}
</style>
</head>

<body>
	<!--五角星等级-->
	<div id="star" class="star2">
	</div>
</body>
</html>

看代码，我们只需要控制 id star 的class样式，star + i 就好了。或者你还有更好的方法~~

本文用到的例子下载点击这里空间占用百分比，星级例子

随机阅读

滚动条的体验，左边还是右边好？

o仔 — Mon, 12 Apr 2010 20:18:13 +0800

平常我们习惯了滚动条在右边，如果把滚动条突然放在左边，相信用户一定不会习惯的。。但是假如你的导航菜单是在左边，你的内容又很长需要滚动，那这个时候左边的滚动条就可以派上用场了。用户只需要移动很小的距离就可以拉动滚动条。

假如你的分辨率是1366*768，菜单在左栏，宽度200px，那么如果你鼠标移到滚动条位置拖动就得移动 1166个像素，而在左边的话，你只需要移动200个像素不到。。我们很多内容都在中间，也就是200px后，那鼠标经常活动的位置也是这么一小块地方，你说是从左边近还是右边近呢？

也许你会说，我不用拖动滚动条的，我用鼠标中间的滚轮滚动就可以实现了，干嘛要去拉呢？是的，对于用鼠标的用户来讲，其实并没有多大必要，但对于笔记本用户，他没有用鼠标呢？他需要在中间的鼠标移动区域划好几下。。特别是在现在宽屏比较普遍的时候，更是需要我们多去注意一下用户的体验。。屏幕越大，被我们忽略的东西就会越多，相信这个小小的改变会对让你的用户对你的网站更有依赖性的。

怎么让滚动条在左边？其实很简单，只需要一个属性就够了。。

<html dir="rtl">

把下面的例子复制看看

<!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" dir="rtl">
 <head>
  <title> 滚动条的体验，左边还是右边？ </title>
  <meta name="generator" content="editplus" />
  <meta name="author" content="o仔札记 imouou.com" />
 </head>

 <body>
<h1>看下你的滚动条是不是在左边了？</h1>
  <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/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
 </body>
</html>

比ietest 更好的浏览器调试工具 Browser Sandbox 使用教程

o仔 — Sat, 10 Apr 2010 00:47:06 +0800

还没写过这么长的标题，browser sandbox全名叫Xenocode Browser Sandbox，看到这个标题有点兴奋，当我今天在搜手机模拟器测试的时候，无意中发现了这么一个东西，当你搜索 Xenocode Browser Sandbox 的时候，你就会发现有很多关于这个软件的介绍，但总感觉只是写手用来宣传的广告语，不知道是不是真的有用，是不是他们有钱收的。。不过可以肯定的是，我写这篇文章我是没钱收。哈哈，好了，废话不多说了，进入正题吧。

以前我会想，如果一个系统可以同时装ie6, ie7, ie8，firefox2, firefox3, firefox3.5, safari3, safari4, chrome , opera10, opera9,那就好了，虽然现在也有很多方法来解决浏览器的兼容性测试，但是就我目前的了解情况，这样得装好多个虚拟机来测试，这样是一点都不方便，像ie6 ie7 ie8 虽然有 ietest 还有其它工具来帮助测试，可是偶尔还有些差异，明明ietest没有问题，在别人的ie6 或者ie8下，却出现错乱，当然这个不能全怨浏览器，自己本身的代码写法可能也有问题，写得好的xhtml是很少出现兼容问题的，因为他们了解浏览器的各个bug，ie三个解决了，firefox呢？firefox几个版本怎么共存？用绿化版的？ok，opera呢？safari呢？chrome呢？从官方下载的chrome目前采用自动更新的，应该就是防止出现多版本共存的情况的。我以前试过最多装的测试浏览器有7个，真的已经挺多了，没想到还可以装得更多，现在这种想法终于不是空想了，是的，真的可以，上面提到的浏览器通通可以兼容，通通可以在一个系统打开而不影响目前的系统环境。

东西真的是个好东西，对于我们在web前端做页面构建重构这一块工作的人来说，但是你会发现打开官网，就只有几个浏览器在那里，也没有教你怎么做，啥文档也没有，我看了大半天，好不容易把安装程序弄下来，差点没搞懂怎么用，所以才想写篇文章写给跟我一样迷茫的页面构建者，希望能有点帮助。欢迎拍砖反馈使用效果。

打开官方地址：http://spoon.net/browsers/

我发现官方含谷歌广告打开缓慢，因为以后可能每天都得连线打开这个地址，打开缓慢会很不爽，但我们也要体谅一下人家好不容易整的一个赚钱方式，不用你捐助还想咋样啊？

如果不爽上面的带广告的页面，也可以使用我下面的在线地址，没广告的在线使用地址：http://imouou.com/allbrowser/ ( 除了去除广告还删除了很多不必用的代码，加快了打开速度 )

你也可以下载本地版的 http://imouou.com/allbrowser/allbrowser.zip

这些打开页面都是需要连接到官方取数据的，所以如果你不能上网的话，你还是别整了，我也想搞个离线版的，这样我就不怕网络打不开的时候不能用了。搞了半天，没能搞定。。如果有哪个高手搞成了离线版，记得分享一下啊。。

具体使用步骤：

1. 打开在线的使用地址：http://imouou.com/allbrowser/ ( 去除广告快速版，没安装插件前暂时点链接浏览器是没有反应的 )
2. 点击下载安装spoon-plugin插件（需要重启所有在用的浏览器）
3. 然后再打开http://imouou.com/allbrowser/ 点击上面的浏览器就可以在线安装各种浏览器，会有进度条提示你下载结束，然后就啥都没有了，也没有告诉你接下来要怎么去做。。后来才知道要用第4步
4. 安装好以后，就可以通过上面的使用地址http://imouou.com/allbrowser/ 来启动浏览器了。你也可以下载本地版的 http://imouou.com/allbrowser/allbrowser.zip 来启动浏览器

这个插件据说是利用了虚拟机的方式，达到浏览器多版本共存，确实很新颖，也很吸引我，在适用过程中，发现单个浏览器的启动速度有点慢，可能由于在线获取的关系吧，如果想同时打开所有的浏览器，很慢，要先关掉一些才行。。反正对我来说非常好用，我只需要测试好几个主要的浏览器没有问题，然后再一个一个打开测试最终效果，有问题的单独解决。。哈哈，它最大的优点是跟浏览器的效果一样，不是模仿出来的效果，目前还没有发现不同的地方。。欢迎拍砖啊。。

详细使用教程：http://imouou.com/blog/browser-sandbox-jiaocheng/

下面我用我写的一个代码作品，来测试各个浏览器的兼容性，原先已经在ie6绿色版，ie7，ie8，ietest，firefox3.6，safari4，opera10，chrome等浏览器测过，可以宽度自适应兼容，以下是在Browser Sandbox激活的浏览器测试的截图，看图吧，点击图片可以看大图。

在ie8浏览器测试效果图

在ie7浏览器测试效果图

在ie6浏览器测试效果图

在firefox3.5浏览器测试效果图

在firefox3浏览器测试效果图

在firefox2浏览器测试效果图

在safari4浏览器测试效果图

在safari3浏览器测试效果图

在chrome浏览器测试效果图

在opera10浏览器测试效果图

在opera9浏览器测试效果图

o仔札记 -- W3C标准下的页面构建

Iframe内容自适应两种方法

相关阅读

让wordpress显示首页index.html

相关阅读

让页面绝对水平垂直居中–jquery例子

随机阅读

National Geographic Flash

相关阅读

谷歌flash跟踪统计Google Analytics Tracking for Adobe Flash

随机阅读

学习jquery笔记(1)

随机阅读

li 不设高度可能导致ie6 ie7 新问题bug

相关阅读

loading条实现空间占用百分比的CSS

随机阅读

滚动条的体验，左边还是右边好？

相关阅读

比ietest 更好的浏览器调试工具 Browser Sandbox 使用教程

相关阅读