捌玖网络工作室 » ASP,PHP,CGI,JSP技术 » 网页常用特效整理：高级篇

admin 发表于 2008-1-19 22:37

网页常用特效整理：高级篇

笔者日积月累了许多精彩、实用的Web特效的制作，这些特效几乎都是比较常用的网页特效。现在我就把这些经过整理和修改过的特效分三个级别分别介绍给大家。SLr-Dm T
;F5p-Fsu5l,{|
　　高级篇
tT9o+}_W\ @ $}9d({X W Z-b7Z
　　1．不同时间段显示不同问候语
!biZ1V4zzP,~D +\/lX;E0ix9u
　　
e(D!D3G!Oe/\G~#W6Fz
,W$Rd`@ 　　2．水中倒影效果
6ncG3K3nH ie
Yc*zah2z 　　＜img id="reflect" src="你自己的图片文件名" width="175" height="59"＞
XQ*yRk],N 　　
2p2btGx9Gp b4H'bN"~s
　　3．慢慢变大的窗口)M'W
A#N4I
*LZ%N+W
y,u
　　
*\lW)G:F8x:s 　　＜p＞＜a href="javascript:openwindow('http://89w.org')"＞进入＜/a＞REKw5_FN.yV

VwO I)]G8w"a 　　4．改变IE地址栏的IE图标2dNSQ,I+}

HcBu`)x^I 　　我们要先做一个16*16的icon（图标文件），保存为index.ico。把这个图标文件上传到根目录下并在首页＜head＞＜/head＞之间加上如下代码：
{d
s Rc*F THaa.iqa+`
　　＜link REL = "Shortcut Icon" href="index.ico"＞?o;]XUT
5．让网页随意后退f QRG]*F QC

7A,h!}1O5fWn8SP 　　＜a href="javascript:history.go(-X)"＞X＜/a＞ //把X换成你想要后退在页数vW"K5Q7D.kYrq
　　         //把“-”变成“+”就为前进
9Ov6u9VkbU+C4v 3X/R?T\Df~(pB
　　6．鼠标指向时弹出信息框8x3vWQ D+m@
D#m^T @-FL)pLo
　　在＜body＞＜/body＞之间加上如下代码：
)u$w!Ye!lak *]Ps6sG _Zh
　　＜a href＞显示的链接文字＜/a＞|D5l.z U P#W.Jmef
a#g0e-q h[TA
　　7．单击鼠标右键弹出添加收藏夹对话框
(p2w!gKA0[
5zV&tw.O Y N5j 　　在＜body＞＜/body＞之间加上如下代码：8f}un8O`z5y
7i?6[)sX'j
　　oHj2C P.@T$@
G \.D4c~Sy1A5E
　　8．随机变换背景图象（一个可以刷新心情的特效）
7`(~Q q`)H0h yy 1TUJ's,ieI;V(V
　　在＜head＞＜/head＞之间加上如下代码：
(`zc'_S1l3r
t@"Q
V:^3\ b])bR 　　
/e"}R4q._9f
%a.u*Q2es\&W 　　9．鼠标一碰就给颜色看的链接rO`v6t

gbOu"XU{\;\ 　　在＜body＞＜/body＞之间加上如下代码：(Or)N#U(~[$F3w

-F)fG~L
G)K$K3vf8` 　　＜p＞你敢碰我，我就给点颜色你看！＜/p＞
%\5MkpD5FNv 　　*pcZ}.{
a7W7{_3Le$X`7ht
　　10．从天而降并有幻影效果的窗口
UU-m0DEGxV&R 6b fSFn
　　＜head＞
v b+za
@-^)}(\;B6_ 　　＜Script language="javascript"＞
+p"U1K B7{*}}%s)ka 　　function move(x) {
I }"^bk%h)e 　　if(self.moveBy){
1\,R ? ?6Q 　　self.moveBy (0,-800);"@Hlv#@ @
　　for(i = x; i ＞ 0; i--)5x8AQ~KY3~
　　{
*T+@MY T+u-}.o 　　self.moveBy(0,3);!d1[ m+^N:D`RHbu0Aj
　　}`9iHvSC;z)d$d
　　for(j = 200; j ＞ 0; j--){  //如果你认为窗口抖动厉害，就200换成个位数
*^N%N9x&F$L#J r 　　self.moveBy(0,j);'_4yy9G oE_[@d _
　　self.moveBy(j,0);
@6F?,S7le C3N 　　self.moveBy(0,-j);+[ dZ!`1gYD\&sV
　　self.moveBy(-j,0);
4[I!\ QTZ8B 　　}
_,CK.AG*~(^.b5g8U 　　}

W j_F8L*W3z 　　} jAg2\8tS J|
　　＜/Scrip＞
{Cv!A o)f 　　＜body bgColor=#ffffff onload=move(280)＞
*Q7EO"}X(O 　　＜/body＞/fo|gQq4MJa'Gy
　　＜/head＞0P!k'_7Wyt
F:a9ar3Hd
　　11．表格的半透明显示效果J'i#o%KT9M_T

Y!c~;d ^;M(Oy 　　在＜head＞＜/head＞之间加上如下代码：
uX
ID0e/cHb $R5NV4[k"E
　　 z%sD:|+m b;s7C*D"IC
hE`_ cB#mN
　　在＜body＞＜/body＞之间加上如下代码：
*_(`PGdq2{O'c 　　＜table border="1" width="100" height="62"  class="alpha" bgcolor="#F2A664" ＞
%^;J!k,P(O+UC)Q:f 　　＜tr＞
t?U,|0n{%L 　　＜td width="100%" height="62"＞
{Y)_6y@(J d2`s 　　＜div align="center"＞很酷吧!＜/div＞3|v~5X4`y
　　＜/td＞
]/oG:L B {)_3e 　　＜/tr＞ iWjT4yt0aSC
　　＜/table＞

查看完整版本: 网页常用特效整理：高级篇