Skip to content →

月份:2011年12月

一个基于Jquery的打字效果插件TypingCat

前段时间,要写一个页面,需要用到打字效果。在网上找到几个基于jQery的插件,但是有些太复杂,有些不太可控。于是干脆就自己写了一个。

用法和效果都比较简单,直接把html的代码写出来,看注释应该就知道怎么用了

首先需要在 <head></head> 中加载必要的插件

<head>
…
<script type=”text/javascript” src=”js/jquery.js”></script>
<script type=”text/javascript” src=”js/TypingCat.js”></script>
</head>

而html的body中有如下标签内容(用来承载打印效果的位置):

<body>
<div><a href=’#’>back</a></div>
<div id=’pra1′>
<div id=’word1′></div>
<div id=’word2′></div>
<div id=’word3′></div>
</div>
<div id=’pra2′>
<div class=’word1′></div>
<div class=’word2′></div>
</div>
</body>

然后需要做的是,在任意位置加入下面的代码(开始使用插件,示例是放在了head标签里面):

<head>
<script type=”text/javascript” src=”js/jquery.js”></script>
<script type=”text/javascript” src=”js/type.js”></script>
<script>
$(function(){
l_blink_speed = 300;    //’‘闪烁速度 speed ” blinking
l_blink = 14;           //‘’闪烁次数 times ” blink
l_blink_s = 8;          //‘’闪烁次数(少)times ” blink (fewer)
l_start = 2;            //how long to wait before a new line starts
l_start_q = 1;          //how long to wait before a new line starts (quick)
w_blink = 80;           //汉字打印时间间隔 speed of tying
hide_time = 2000;      //字体层隐藏速度 speed of hiding
wait = 1000;            //weit 3 second before start
typeWriter(“this is Pra1’s 1st words”,”#pra1″,”#word1″,l_start,l_blink_s);
typeWriter(“this is Pra1’s 2nd words”,”#pra1″,”#word2″,l_blink_s,l_blink);
typeWriter(“this is Pra1’s 3nd words”,”#pra1″,”#word3″,l_blink,l_blink_s);
typeWriter(“this is Pra1’s 4nd words”,”#pra1″,”#word3″,l_blink_s,-1);   //retype in the same div. -1 means this pragraph  will disappear after finishing typing
typeWriter(“this is Pra1’s 1st words”,”#pra2″,”.word1″,l_start,l_blink_s);
typeWriter(“this is Pra1’s 2nd words”,”#pra2″,”.word2″,l_blink_s,-2);   //-2 means this pragraph will not disappear and ” will blink without stop
})
</script>
</head>

真正产生效果的是typeWriter(str,pra_id,div_id,wait_before,cur_wait)

参数的意义分别是:

str:需要打印的文字,注意最好不要打印‘’这个符号,因为它作为光标使用了

pra_id:段落的id或者类名,从例子中可以看出,如果是传入id则用”#id”的形式,如果传入样式的类名则用“.class”的形式。文字的消失是以段落为单位的。

div_id:每一行用div层引起来,这里是段落中各个div的id或者样式类名。用法同上。

wait_before:上一行的光标闪烁次数,也就是说上一行打印结束后多久才开始打印本行。

cur_wait:本行结束是,光标的闪烁次数。

上面的一些变量有说明,可以自己修改调整各种效果的时间和速度。

效果可以看这里

下载在这里

Leave a Comment

《鸿门宴》观影记录

今天中午拿到票,结果3点多的时候中心忽然有事,弄完都5:40了,电影是5:45开始,赶到影院的时间是6:00。

一进去就看到刘亦菲被欺负。根据国际惯例,欺负女人的,一定会便当。欺负女主的,肯定会马上便当。果不其然,在刘亦菲脱到一半的时候,霸王出现了。坏人就便当了。

霸王,说你愿意跟我么,刘亦菲说我愿意。这剧情真招人恨。

然后霸王这个白痴就让刘邦带着自己的女人跑路自己去打怪了,然后刘邦就趁着霸王和自己不在一个区,带着霸王的女人直接转到咸阳服务器了。

Leave a Comment

关于时间旅行的一些讨论

前言

穿越是近年来大家喜闻乐见的娱乐活动。大众开始关注穿越,我想“电视剧”这种大众媒体形式应该做出了不小的贡献。从很久之前大名鼎鼎的《寻秦记》,到现在各种“清穿”剧,还有在微博上被炒起来的《李献计历险记》,都在某种程度上代表了穿越的一种类型。作为一个伪资深理论科幻读者,某猫将在本文对“穿越”这一行为做一个全面的分析和总结,希望能够带领大家穿越迷雾,一睹芳容。
接下来,我们分别来看一下和时间旅行所相关的有趣原理和其可行性分析。

Leave a Comment