|
浮动QQ在线客服&网站QQ在线咨询 - Q. P3 D Z: U. `! q" k7 z
第一步:先把以下代码保存为kefu.htm
/ }2 L0 f) H+ U; _0 A第二步:按橙色说明修改
. ~0 P8 T' y# @/ ]) t绿色部分是要修改的内容,html文档中不包括说明文字: : n0 J# \) Z( K' A6 m) w
<html>
' R# w" C6 w, ~* C+ Y; ^6 C<head> 8 C( g6 h- w( v8 d$ k. \+ S7 V
<meta http-equiv="Content-Type" c>
5 e4 @5 F; V! Y5 A<link rel="stylesheet" href="images/ im.css" type="text/css"> & M, z, p. P; p: h9 D3 [
</head>
r0 z/ f C7 P8 N! C" T2 O<script> 4 s9 [" C7 z4 u! n
var online= new Array();
. B/ q( Y) ?" q6 E) @' I8 K7 tif (!document.layers) 5 N* d9 |# _1 Q4 Q& k j. j0 w
document.write('<div id="divStayTopLeft" style="position:absolute">')
, e0 t% { ^, ?- G; d0 e</script> ) {" K) t8 U# T' d
<layer id="divStayTopLeft">
; Y! J% W( U+ U5 x2 x, F<table border="0" width="110" cellspacing="0" cellpadding="0"> / L7 |7 E; w; p8 [% s& u
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr> / B9 Z. @4 c' R" O# y& |8 M9 b
<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script> - y# W( k' ~9 S/ c/ N& _: [
将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束
6 [* s! h8 S- G$ S6 @, v: G" j
+ l# W6 L# L: x; a) W0 h/ z以下部分显示第1个客服QQ,注意:online[0]
) M6 d' h1 l1 V3 d# d% L<tr><td valign=middle background=images/kefu_middle.gif> ; o- p* J7 O! p
<script>
" c! Y: Y. k! F5 m6 \if (online[0]==0)
! Q7 r% o0 [8 r. d) Cdocument.write(" <img src=images/QQoffline.gif border=0 align=middle><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27089965&Site=在线咨询&Menu=no' title='客服不在线,请留言'>售前咨询</a>"); ) k n( [' D% q- f
else
. i. D/ _8 `% j5 e# e0 B$ jdocument.write(" <img src=images/QQonline.gif border=0 align=middle><a class='qqa' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27089965&Site=在线咨询&Menu=no' title='在线即时交谈'>售前咨询</a>");
; y" Q8 b6 [& Y</script > 9 ^+ `9 f# i, @9 ]& v
</td></tr>
5 s- v7 x- \# q 9 ]3 _/ b3 m. s" x
以下部分显示第2个客服QQ,注意:online[1]
) V" o- t6 j& i<tr><td valign=middle background=images/kefu_middle.gif>
6 z& L/ C0 r+ r3 t. @: O<script>
7 Q9 K8 s p' o A" C4 t, H6 iif (online[1]==0)
5 s/ X: A1 B( N* ^2 O" P( Y! ?/ \document.write(" <img src=images/QQoffline.gif border=0 align=middle><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27043921&Site=在线咨询&Menu=no' title='客服不在线,请留言'>技术支持</a>"); 3 `' x, @7 d0 y; X9 d: i
else 9 X8 p0 }4 T/ ^ c q
document.write(" <img src=images/QQonline.gif border=0 align=middle><a class='qqa' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27043921&Site=在线咨询&Menu=no' title='在线即时交谈'>技术支持</a>"); : U: a! h) Y5 I: @* [# |. E- `7 U
</script > ) H+ t, g' ?& v, t
</td></tr> 1 k/ E7 z& K7 `6 `3 F, ?
* @/ S8 I, p( ]/ A* n以下部分显示第3个客服QQ,注意:online[2]。 ) q C4 k1 U& g
<tr><td valign=middle background=images/kefu_middle.gif>
* A, ?/ Z" |4 @ {* u<script> " |$ X ?2 }: L6 J; B" n
if (online[2]==0)
* I9 i3 {0 B. y# c9 M' a% udocument.write(" <img src=images/QQoffline.gif border=0 align=middle><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=240434782&Site=在线咨询&Menu=no' title='客服不在线,请留言'>代理合作</a>");
3 M) Z( R2 c s1 welse % z# p( Z; \: a K
document.write(" <img src=images/QQonline.gif border=0 align=middle><a class='qqa' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=240434782&Site=在线咨询&Menu=no' title='在线即时交谈'>代理合作</a>"); / `) m. U! i* t! r
</script >
9 B5 i* v. p$ I4 @' Y* p% H</td></tr> ! Q) ^8 B+ r2 P
0 t" Y& i6 n* ]; |# h多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。 ' \$ v2 m* u' V
3 R2 z9 h- i; d( \- x% t4 N
<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr> ' z* W' E+ [- Y' \& J2 d
</table>
) O" p7 n; C! l' d1 X/ @</layer>
* C1 u( c) B1 U0 g<script type="text/javascript"> 2 X% T0 Q" U: l& q, {1 C0 M
//Enter "frombottom" or "fromtop"
7 Z+ j6 |$ F7 H9 ?var verticalpos="frombottom"
5 |9 M q, O- @# Q" nif (!document.layers) ! ~) n! C( i( s4 b# \6 Q1 Y
document.write('</div>') % ]; Q+ K; e4 B+ h+ {
function JSFX_FloatTopDiv()
5 ~# R, S$ {$ W% `& U9 h6 F{
- B* j3 P5 _" D4 B. c; ]下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。
( n& r- i- U! f8 x& R7 f var startX =3, 7 d) W- L) p$ ~* U: L Q
startY = 250;
' h. j) Y" y' x! m, R var ns = (navigator.appName.indexOf("Netscape") != -1);
1 C, i, u, e& d: x, ~$ [ var d = document;
/ c# {/ w1 z# {3 m8 q& ^+ V function ml(id)
# T7 M4 L2 }# |+ L; t2 ? { L( p* [5 V/ s* W$ W0 I
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
! |! @9 l! R6 d- J3 ?& v7 B/ x! b9 i if(d.layers)el.style=el;
: O0 Y( M- S- E3 H9 x# G el.sP=function(x,y){this.style.left=x;this.style.top=y;}; e6 \0 C" P& t$ P7 T) W
el.x = startX;
+ @8 l2 A+ L: u0 X+ I if (verticalpos=="fromtop") % t8 S- c2 G1 {$ q
el.y = startY;
7 L% P' d& R! q0 ? else{ : y7 i, \/ j. J, z& ^2 I, N
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight; ( l: }( |5 F$ J9 S' L: v
el.y -= startY; 0 S J! q6 [$ d \/ D$ W
}
& a; c4 P; ?, q0 s return el;
. p' v% c0 c: o# K- @( x0 v }
7 S5 D9 J, A' h* ?5 d window.stayTopLeft=function() 2 J8 \ a" l6 m0 V
{ 1 o' \; B* G3 x! D
if (verticalpos=="fromtop"){ ; T/ J! h: _+ l; X% _; n& o2 z, i
var pY = ns ? pageYOffset : document.body.scrollTop; 8 T+ t# E' p5 |4 Q* l6 M
ftlObj.y += (pY + startY - ftlObj.y)/8; 8 a) g9 [) {% s- C1 K
}
5 m& P1 X. y6 w; M else{
B5 ^( s& h: r! U& w D var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight; & C( R5 K: W, ~/ \. @& [% ~! b
ftlObj.y += (pY - startY - ftlObj.y)/8; ; L, ?+ S; f6 a& y! f3 ?* |
}
8 C1 @, r/ M3 V0 Q5 Y! \ ftlObj.sP(ftlObj.x, ftlObj.y);
1 ?; o# I% [8 x U4 {, Y3 X setTimeout("stayTopLeft()", 10);
1 d, Y4 T" Z' M } 9 \- F" U% T$ B4 l
ftlObj = ml("divStayTopLeft");
3 ]/ h8 v. \+ w0 f ~' S- S- _. d& ~ stayTopLeft();
# k6 {8 X! z* a y} / h1 K9 D5 X0 ]; o T. j5 c
JSFX_FloatTopDiv();
# Q# w! ]5 ]; V/ m' M% t</script>
6 g9 {; u) |$ `& k</html>
+ M4 N" ^1 O4 m第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。 ) t0 d+ y2 C+ Y( F m) Q
http://imis.qq.com/images/wpa/images/kefu_up.gif ) Y) R+ Q3 J$ g- Q% O w; d
http://imis.qq.com/images/wpa/images/ kefu_middle.gif
& V* S' u8 n' l8 K' | i* x+ Chttp://imis.qq.com/images/wpa/images/ kefu_down.gif
; m6 q. k9 w0 C) K- mhttp://imis.qq.com/images/wpa/images/ QQonline.gif
) J9 \/ s& [) l. { `; `/ yhttp://imis.qq.com/images/wpa/images/ QQoffline.gif 4 b! D9 p; `0 w6 D
http://imis.qq.com/css/im.css 6 m3 L9 m# q8 e" G6 ]
第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |