[米随随] s5s5

😂

大家可以用IE点点本站的其它链接看看效果哦～比如顶部导航中的“踢馆！！！” 😛

原理就是利用CSS的转换滤镜一定要把后面的元素一定要加载完成才会进行转换，还有监视是不是有离开本页的动作发生，组合起来就可以了～

这是加到页面 head 区域的CSS的转换滤镜

程序代码

<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)"
/>

用 onbeforeunload 事件来监视离开本页的动作然后控制 ID 为 loading 的 DIV 的显示，加到 </body> 上面

程序代码

<script language="JavaScript" type="text/javascript">
  function loading() {
    document.getElementById("loading").style.display = "block";
    document.getElementById("loading").style.top =
      (document.body.scrollTop
        ? document.body.scrollTop
        : document.documentElement.scrollTop) +
      300 +
      "px";
  }
  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="color:#FFF;background-color:#C00;font-size:16px;">
    ㊕㊢ 正在加载...
  </span>
</div>

这样就完成了，HOHO，这个也可以叫AJAX吧，虽然和“X”没什么关系…… 😅

其实这样做是让浏览的人等的时间长了一些，因为一定要等后面的页面loading结束后才会显示，所以没什么用，到是当离开页面时就出现这个loading有一些意思，感觉好有人工智能哦～

UPDATE 2006-12-27:加了一行让 DIV 一直在当前屏幕中间的代码

米随随 岁次丙戌九月廿九亥时 书于北京