尽管现在的版主们已经不太注重计数器的宣传效果了，但计数器还是当今网站不可缺少的部分，它不仅在一定程度上反映了网站的“活力”，而且还可以通过生动有趣的设计来加强网页的“艺术”性，使计数器成为网页上的一个装饰“亮点”。下面介绍两种设计趣味计数器的方法，希望能对版主们有所帮助。

　　一、基本素材

　　趣味计数器是将计数器的设计与趣味性的显示效果结合在一起，十种不同风格的计数器随机出现在网页上，为相对静止和严肃的网页增加一些动态的效果和趣味。第一次访问时，计数器显示的可能是红色的静态数字，第二次访问时，计数器可能变成了不断翻转的动画形式，第三次访问时，计数器可能又变成了由虚到实的虚幻变化形式。为了实现这种效果，首先需要准备一些基本素材，即十种显示类型的数字图像文件。可以用图形编辑工具（如Photoshop、Animator等）根据自己的想象制作，也可以直接从网上图片库下载，然后将这些数字图像以00.gif……09.gif……90.gif……99.gif的形式存放在一个可读取的目录中，在下面的例子中这些图像文件存放在“http://localhost/images”中。这里gif文件命名的原则是：第1位数字代表显示类型，第2位数字代表数字值，如00.gif代表0型数字0的gif文件，09.gif代表0型数字9的gif文件。

　　二、利用JavaScript制作趣味计数器(——设计方法之一)

　　1.设计思想：

　　该方法的关键是Cookie技术和动态图像特性的综合运用。使用Cookie，可以在用户端的硬盘上记录用户的数据，下次访问此站点时，即可读取用户端硬盘的Cookie，直接得知来访者的身份和访问次数等有关信息。JavaScript中通过document.cookie属性访问Cookie，这个属性包括名字、失效日期、有效域名、有效URL路径等。用等号分开的名字和其值是Cookie的实际数据，本例中用来存储该访问者访问该页面的次数。通过把Web页中的图像映射到一个images数组，一定条件下修改该数组项的特性，可以实现动态图像显示。本例中，首先预载入一组图像，每次调用该Web页时，随机产生新的一组图像，通过覆盖原图像实现动态的趣味性效果。

　　2．源程序count.html：

　　< html >

　　< head >

　　< meta http-equiv="Content-Type"

　　content="text/html; charset=gb2312">

　　< title >趣味计数器< /title >

　　< /head >

　　< body >

　　< p >< script language="JavaScript">

　　var expdays=60;

　　var exp=new Date();

　　exp.setTime(exp.getTime()

　　(expdays*24*60*60*1000));

　　function count(info){

　　//若是该访客的第一次访问，

　　将计数器值赋1，否则加1累积

　　var wwhcount=getcookie(’wwhcount’);

　　if (wwhcount==null){

　　wwhcount=1;

　　}

　　else{wwhcount++;}

　　setcookie(’wwhcount’,wwhcount,exp);

　　return countdisp(wwhcount)

　　}

　　function countdisp(countvar){

　　//实现随机显示，不足6位以0补全，

　　可以自己调整显示位数

　　var countvar1="000000"+countvar;

　　var howFar1=countvar1.length;

　　countvar1=countvar1.substring(howFar1, howFar1-1)

　　var index=""+Math.floor(Math.random()*10);

　　if (index=="10"){

　　index="0"};

　　for (var icount=0;icount< 6;icount++){

　　var g=countvar1.substring(icount,icount+1);

　　document.images[icount].src="http:

　　//localhost/images/"+index+g+".gif";

　　}

　　}

　　function getCookieVal(offset){

　　//获取该访问者的已访问次数

　　var endstr=document.cookie.indexOf(";",offset);

　　if (endstr==-1)

　　endstr=document.cookie.length;

　　return unescape(document.cookie.substring(offset,endstr));

　　}

　　function getcookie(name){

　　//截取Cookie中的name信息段

　　var arg=name+"=";

　　var alen=arg.length;

　　var clen=document.cookie.length;

　　var i=0;

　　while (i< clen){

　　var j=i+alen;

　　if (document.cookie.substring(i,j)==arg)

　　return getCookieVal(j);

　　i=document.cookie.indexOf("",i)+1;

　　if (i==0) break;}

　　return null;

　　}

　　function setcookie(name,value){

　　//存储该访客计数器的数值

　　var argv=setcookie.arguments;

　　var argc=setcookie.arguments.length;

　　var expires=(argc >2)?argv[2]:null;

　　var path=(argc >3)?argv[3]:null;

　　var domain=(argc >4)?argv[4]:null;

　　var secure=(argc>5)?argv[5]:false;

　　document.cookie=name+"="+escape(value)

　　+((expires==null)?"":(";expires="+expires.toGMTString()))

　　+((path==null)?"":(";path="+path))+((domain==null)?"

　　":(";domain="+domain))+((secure==true)?";secure":"");

　　}

　　function deletecookie(name){

　　//使该信息行失效，

　　删除该用户关于访问次数的信息

　　var exp=new Date();

　　exp.setTime(exp.getTime()-1);

　　var cval=getcookie(name);

　　document.cookie=name+"="+cval+"

　　;expires="+exp.toGMTString();

　　}

　　< /script >< /p >

　　< !--预载入图像数组-->

　　您是第< img src="http://localhost/images/00.gif"height=20 width=20

>

　　< img src="http://localhost/images/00.gif"

　　height=20 width=20 >

　　< img src="http://localhost/images/00.gif"

　　height=20 width=20 >

　　< img src="http://localhost/images/00.gif"

　　height=20 width=20 >

　　< I mg src="http://localhost/images/00.gif"

　　height=20 width=20 >

　　< img src="http://localhost/images/00.gif"

　　height=20 width=20 >次光临！

　　< script language="JavaScript">

　　//调用count()函数，

　　实现计数器的动态图像显示

　　count();

　　< /script >

　　< /body >

　　< /html >

　　3．注意事项：

　　由于使用了JavaScript语言，因此该方法具有与应用平台的无关性，可以适用于Unix、Windows等多种平台。另外，此计数器不同于一般意义上的访客计数器，专门用于记录某一访客对某一网站的访问次数。