页面加载转换效果

更新:我把这个效果从这个Blog里去除了,效果自己加上试一试吧,反正很简单。很Cool哦

在IE下有效,FX(好像我见到的大多数人都习惯称之为FF)下只能看到加载效果。转换滤镜不起作用。Gecko 的浏览器下面也可以看到。效果请在IE下打开这篇BLog的单独链接查看。很Cool~

没有效果要多试几次哦。这个效果要求新的页面在后台完全加载结束后才会进行转换,因此会觉得加载时间长一些。不过Blogspot还是蛮快的嘛

1.添加到<Head></head>区域,放在前面好了。

<meta http-equiv="Page-Enter" content="progid:DXImageTransform.Microsoft.Pixelate(enabled=false,duration=1,maxSquare=50)" />
<meta http-equiv="Page-Exit" content="progid:DXImageTransform.Microsoft.Pixelate(enabled=false,duration=1,maxSquare=50)" />

2.添加到</body>之前

<script language="JavaScript" type="text/javascript">
function loading(){
document.getElementById("loading").style.display="block";
}
window.onbeforeunload=loading;</script>
<div id="loading" style="position:absolute;top:300px;left:0px;width:100%;text-align:center;z-index:100;display:none;"><span style="background-">请稍候,页面正在加载... </span></div>

via s5s5

8 条评论:

夏卡 说...

So cool!`

匿名 说...

感觉用处不大,而且加载时间会不会因此加长?

Ryan Hooper 说...

除非页面的内容太多,一般都加载得很快。

好处是,免得浏览者在未完全载入时就乱点页面上的内容而导致人为的加载不完整

本来想使用一个会动的ajax loading gif来代替文字,但发现gif不会动了

GG 说...

最新 测试,IE7下无效果~~~

咖啡鱼 说...

不对,我就是用的IE7,很正常。IE6早就不用了

GG 说...

不是吧,我又试验二遍

直接关闭ie7,没有效果

打开2个窗口,按标签上的关闭的那个叉叉或者点击鼠标中键关闭也是没有的。

哦,我理解出错,在maxthon的IE6里关闭也有效果。

IE7切换另外一篇文章的效果的确很有趣~~

匿名 说...

安裝以後Lightbox的loading.gif變成不會消失...

目前我是用透明圖取代lightbox裡原來的loading.gif...

有解決的辦法嗎?

咖啡鱼 说...

嘿嘿,我没有专门学过JS,很抱歉。不过可以去问问原作者。
http://www.misuisui.com/weblog/article.asp?id=559