浮动QQ在线客服&网站QQ在线咨询
7 {5 E& H0 j- R" x5 K; K. M第一步:先把以下代码保存为kefu.htm 9 i, M/ T0 {% v$ c- X+ _) j
第二步:按橙色说明修改
1 V% O: v7 i" S3 E$ m/ ~8 |' h! K绿色部分是要修改的内容,html文档中不包括说明文字:
# t/ S4 u" \4 b<html> # p- o, `7 m6 G
<head>
6 {6 p9 ]6 S4 m* ^<meta http-equiv="Content-Type" c> 0 ~- a9 L% M) t" \& N
<link rel="stylesheet" href="images/ im.css" type="text/css"> 5 v* w; u% a: X
</head> + w0 }" S H+ Z8 Z8 V
<script>
$ F3 D$ g0 a' k$ Evar online= new Array(); w2 Z; @! r+ R# g
if (!document.layers) 6 {: A% q0 \/ S
document.write('<div id="divStayTopLeft" style="position:absolute">') % m0 K2 v( a4 N1 m9 q. f
</script>
# a" p5 b! {! Q; G<layer id="divStayTopLeft"> - G, m) L$ t- R1 P7 W
<table border="0" width="110" cellspacing="0" cellpadding="0">
2 `) L1 p+ a# s5 }( k( d<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr>
8 V9 E' [7 |* D5 G3 |. B<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script> - v4 x+ u2 K* e: Q2 W: F' X( E
将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束
% w$ m7 }( R$ ]; Z! R 1 H5 `( E; n* i( y7 n# I
以下部分显示第1个客服QQ,注意:online[0] 9 \: L5 U/ e0 I5 i, @
<tr><td valign=middle background=images/kefu_middle.gif> 2 N4 }8 J7 H! a3 t) T, y6 ?4 E4 v% n! R
<script>
% d# d7 N; @. k. B( |, iif (online[0]==0)
5 G7 U6 m! b" s+ s! I( jdocument.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>");
, q4 \/ p5 B0 m$ H4 Xelse
4 y7 @6 W2 z% f! g* Y& L' J( hdocument.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>"); - s0 Z; L* a% i- G/ r3 ?. _
</script >
; T! b- |$ h. d4 y4 Q2 }% x' } _7 ]</td></tr>
6 n3 m/ ]! e" c+ j# T! d
W* U' E, i3 A以下部分显示第2个客服QQ,注意:online[1]
! Y, T4 V8 v' J+ V$ f9 Y<tr><td valign=middle background=images/kefu_middle.gif>
: V( Q0 w( H$ N2 g I0 O/ V<script>
, V0 ^, |; _5 O+ uif (online[1]==0) 8 _/ X; I8 ]0 W# G
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>"); 7 z; h- J p! Y( E9 N0 x6 c, [; ?
else
& \/ f8 d! D8 D; mdocument.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>"); 8 e4 a$ u, W2 x( H& Z8 g
</script > % ?3 w9 n& z' O- @$ e
</td></tr>
3 w- m- d$ [. |( M% T2 m* Y
' ?+ r4 N$ v6 [' u! ^# C9 S以下部分显示第3个客服QQ,注意:online[2]。 : K5 r% `$ T4 h+ \- T" s! F$ f
<tr><td valign=middle background=images/kefu_middle.gif> ) h9 C1 c+ Q: c! m2 G7 |" z
<script> & P3 e3 `7 \) t9 D+ l
if (online[2]==0)
0 t3 C# _5 m `* tdocument.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>");
+ |: ?2 I. D* a! W: U. F. ^else
' D4 f1 s& |7 j2 {8 Adocument.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>");
) p' @. A% ]) q</script >
; m: ` f2 R6 y) X1 m$ V- t</td></tr>
( O- V# G0 }( a& \ 6 }7 U4 |1 h# E
多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。
9 F% U4 d. {' R) K* ~: p
4 k9 f6 d1 E, a: |9 _- g) u8 K<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
7 \4 b0 i1 \6 n; }; o</table>
, Y5 l+ y9 k" g</layer>
* b2 D2 h6 {3 S" }<script type="text/javascript"> % M, G9 w* ^9 q' C" P
//Enter "frombottom" or "fromtop" 1 E: h5 L. O! D: A
var verticalpos="frombottom" : s( f3 r4 J# t$ _, a. J d
if (!document.layers) o: k1 F: s6 {) [+ Q
document.write('</div>')
- h1 w! o4 S+ [4 W2 f( |function JSFX_FloatTopDiv()
( F0 u( j6 @" y5 P; q1 [. [7 S: N{ , D4 {* r( M# l4 ?- u
下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。
9 s2 D: a6 E1 ` var startX =3, + H" p& b. V2 Q) o# Z" ^
startY = 250;
4 N1 j1 \8 g) ^* l c" r var ns = (navigator.appName.indexOf("Netscape") != -1);
* a+ [7 W$ Q9 M: X var d = document; x3 T% U+ ^ O; E
function ml(id) ( e9 p, t! G$ j: f3 w6 H
{
0 @( D5 D1 F S+ s1 C) ^6 I3 j var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; 4 i8 j' h: I( v8 @
if(d.layers)el.style=el; , U$ _: i, X' x" t
el.sP=function(x,y){this.style.left=x;this.style.top=y;}; 8 c& I/ n& {) d' s2 z
el.x = startX; ; [+ s8 @/ c3 k' B2 p
if (verticalpos=="fromtop") $ X7 {2 b1 V1 M! U& n
el.y = startY; ) k7 m1 T T" z# [# P. f, T
else{ ' s9 b& G* F4 s* d
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight; ! y K, S+ _# p9 m$ c( H
el.y -= startY; ; }8 ^2 C: u0 W, Z
} 5 H: o) Q. B+ x
return el;
, Z( @+ a7 o- r/ T }
1 G* ]; a1 K" Q0 [$ g window.stayTopLeft=function()
% h0 v( B; y. j, g* K {
1 J: Q% @1 W" t8 Y: m: A+ s! h if (verticalpos=="fromtop"){
" J+ l$ }0 }0 D y var pY = ns ? pageYOffset : document.body.scrollTop;
# L) g3 d" N! K* X' ]' L& s/ M' i ftlObj.y += (pY + startY - ftlObj.y)/8;
( Y/ e: w. J# i: h5 A }
2 c- d6 s+ f& z else{ + C2 H. ~4 X2 y2 |/ w+ a- F- c
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
2 h) ^/ N0 Z* J" R ftlObj.y += (pY - startY - ftlObj.y)/8;
* a6 ?! Y/ H: b# ] Z! z. x3 | }
0 b) V# d7 K& D8 S$ b ftlObj.sP(ftlObj.x, ftlObj.y); 4 y0 i' I; i2 M2 c5 o
setTimeout("stayTopLeft()", 10);
' x% a6 z$ j( H. V5 n, m) r }
( u0 c* A/ v8 M; ]2 m4 P& A, g+ E ftlObj = ml("divStayTopLeft"); ; W1 a8 A8 y% ?" W% T+ `
stayTopLeft();
' B- I1 W$ \; B3 ^$ C* f7 f6 d# a}
0 U% {+ {- |- g* ~ l9 g3 FJSFX_FloatTopDiv();
9 g7 B' A: [ f* }</script>
& C5 }: H! b( `3 V% G</html> 7 ]# H; \7 t- F* ]" Y
第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。 / {& T* K7 g4 Y1 j( z& J7 x, Y
http://imis.qq.com/images/wpa/images/kefu_up.gif " h% C/ ?4 X# E& P( N; d3 I- V
http://imis.qq.com/images/wpa/images/ kefu_middle.gif ' M9 P1 c+ G3 _8 F1 a
http://imis.qq.com/images/wpa/images/ kefu_down.gif & H* p# Z, e) z
http://imis.qq.com/images/wpa/images/ QQonline.gif
0 p9 k4 F; Q) Z" ?http://imis.qq.com/images/wpa/images/ QQoffline.gif " Y4 H3 V" g' |
http://imis.qq.com/css/im.css 6 {" K3 \% g4 @/ [2 q
第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |