不做死就不会死

    尽管花儿很漂亮,但只不过是朵漂亮的花——仅此而已。并无任何非凡之处。而你只是个会编程的人。或许你很优秀,但没有什么与众不同。你与我、或者这个星球上其他所有人都是同类。
    你不仅要吃喝拉撒。当然,还要睡。(最好)在很久以后,你会驾鹤西游,你所创造的一切也将随之消失。甚至是象征不朽的金字塔很久以后也会消失。你知道那些建造金字塔的人的名字么?即便你真的知道,难道你知道了就那么重要么?并非如此。金字塔依然耸立在那里,或是随风而逝。平淡无奇。

  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

以下一种简单易懂,方便易用的网页图片预加载技术。:=D。

这种预加载技术使用了javascript技术、静态页面技术、div隐藏技术、gif动态图片技术、bash脚本技术、linux技术等各种前沿NB技术。。。

下面我就来揭开它神秘的面纱吧,当当当!!!!音乐~~~~掌声~~~~~~

---------------邪恶到不得了的分割线---------------------------------

主要思路就是利用浏览器的缓存功能,尽可能简单的实现加载过程。因此该方案生效的前提是浏览器一定要开启缓存功能(IE、Firefox等默认都是开启的)

1.首先,你需要把所有需要预加载的图片放到电脑上的一个文件夹下面。我的系统是ArchLinux的,所以我写了一个bash脚本来扫描图片文件夹下面所有的图片,并生成一段HTML代码,脚本代码如下

#!/bin/bash

for name in $(find .|grep '\.jpg$')

do

  echo "<img src=\"$name\">"

done

for name in $(find .|grep '\.png$')

do

  echo "<img src=\"$name\">"

done

保存为bat.sh,然后设置其为可执行权限并放到图片目录下

接着,打开一个新的tyy窗口,运行.\bat.sh >> 1.txt。就可以得到一份所有图片文件的HTML代码了,代码存储在1.txt里面。

2.在游戏主页面前加入一个loading页面,代码如下

<!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=utf-8" />

<title>很努力的加载中。。。</title>



<style type="text/css">

#loading-black
{ background-color:#000000; z-index:3000; width:100%; height:100%;}

#loading
{width:100%; height:100%; padding-top:212px; text-align:center; margin:0 auto; z-index:3000;}

</style>

</head>

<body bgcolor="#000" onload="window.location.href='index.php?ac=5game';">-->

<div id="loading-black" style="display:block">

<div id="loading"><img src="2008825893756277805.gif" /></div>

</div>

<div style="overflow-x:hidden; overflow-y:hidden; width:0px; height:0px;">

主意!!!!此处粘贴1.txt中的代码
</div>

</body>

</html>

3.最后一步,修改游戏为先跳转到loading页面,而后由loading页面的onload函数转入游戏主页面。

------------------------------------忧郁的分割线---------------------------------------

扩展:这种loading网页还可以被用作后台加载,就是游戏在前台跑的同时,后台自动加载剩下的图片、视频、声音等资源,具体实现方法是将需要加载的资源做成一个网页,像一些必须要调用才能加载的,比如视频、声音等,由js控制按照顺序加载。然后整个网页被游戏主网页用一个size为0的frame引用进来,即可实现后台加载效果。

posted on 2011-02-20 21:04  张家瑞  阅读(3486)  评论(7编辑  收藏  举报