|
浮动QQ在线客服&网站QQ在线咨询 $ Z! b6 i- R1 B# H( w0 N+ n( Q4 h
第一步:先把以下代码保存为kefu.htm ! F0 J5 {; Y( Z+ j0 p, V: u
第二步:按橙色说明修改 ( Y. [. Q; _5 C' c7 p8 h
绿色部分是要修改的内容,html文档中不包括说明文字: ) e) x+ V. k$ x' z: }' C
<html>
$ v6 N( P; X1 C1 ]<head>
# s# z$ ^- c1 A8 r6 r R" F9 f<meta http-equiv="Content-Type" c>
, x, w9 ^/ ?7 T9 C<link rel="stylesheet" href="images/ im.css" type="text/css"> 1 y) {* _8 d1 F: ~# h
</head>
4 L5 G- h: r2 @' D! k<script> * Q, x; b: l f$ F
var online= new Array(); a2 a0 j6 [4 Y/ g
if (!document.layers)
9 `* L; z. [7 d6 Tdocument.write('<div id="divStayTopLeft" style="position:absolute">')
" j7 b9 N. N4 T+ A; V- n* r$ l% M</script> * m& f( Z0 S. V# Y
<layer id="divStayTopLeft">
1 v: O7 {7 F0 ]+ U( V, D<table border="0" width="110" cellspacing="0" cellpadding="0"> $ u* O S% R2 T: w7 @- `
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr> ; y# |6 }* Z1 d+ a) v8 w1 y! Q
<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script> ; V( a+ n! [* M
将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束 * i( g& @7 S8 ~; L ~" ?4 y1 r
0 i4 Q% S' x1 u1 L2 }5 N0 t
以下部分显示第1个客服QQ,注意:online[0]
; h2 s7 \) c+ k4 m, L7 i8 e* M<tr><td valign=middle background=images/kefu_middle.gif> & A! m3 F* u; v
<script> 9 m" _/ t( ~; N! X5 Z# e
if (online[0]==0)
6 R' @/ c/ `3 |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=27089965&Site=在线咨询&Menu=no' title='客服不在线,请留言'>售前咨询</a>"); ! _6 j8 C" ?* C1 X
else 0 y3 a* p8 ~. x4 x' M0 Z
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=27089965&Site=在线咨询&Menu=no' title='在线即时交谈'>售前咨询</a>");
+ P* `& f: _" t8 q) m" Y, c</script >
. n- {9 k$ K( V ~</td></tr>
3 l/ |7 {* R7 h) x: {; ?9 D 2 f+ q$ i) j, z- ~; @
以下部分显示第2个客服QQ,注意:online[1]
! k& Q; h2 F2 ]- a<tr><td valign=middle background=images/kefu_middle.gif>
: B& {- w( @0 b" ]<script> 2 l! v* T6 p8 A2 [
if (online[1]==0) : k8 A+ ` I- `6 z! H( ~; 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>");
& p& w. H' z- I8 o( ^; Ielse 7 w" j9 j! U- X) i! t1 h8 P
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>"); * _5 ~ E5 k1 {* I: p* a' p
</script >
9 R6 Z- \5 A0 K$ f* V2 A C</td></tr> ' u+ {* j' E0 t% ^
# [4 E4 ]# j- H
以下部分显示第3个客服QQ,注意:online[2]。 ' H' `3 M" @/ C- F- N+ n0 r7 J" w
<tr><td valign=middle background=images/kefu_middle.gif>
! B& }/ R$ U% z' o! d$ p2 U2 m<script>
8 j# \$ R P( k% s6 L, @if (online[2]==0)
, k! `1 m+ o- w% Fdocument.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>"); . ?0 m, r# ]/ j3 w
else ( K1 x8 E/ v+ D, o* R
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>"); 2 m1 n5 f, C( _/ S
</script >
2 J, A! V. `! B: S- o8 Z: s</td></tr>
& I/ g1 j. r# V1 l/ E% J {+ Y: ]3 b6 { u! l
多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。 $ R6 l, t& }8 ]. x6 s) ~, U
" S9 A3 L7 [! d7 S0 f4 r; e<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr> 0 Z$ I: ?8 T; T9 T3 j4 q9 s
</table>
5 f! O+ c! g1 ^, [( U0 A# f</layer>
1 L) _4 N I0 L' ]7 o4 l% ?' p+ [<script type="text/javascript"> * D) Y4 w7 Q6 D( ^) e$ v# P) C
//Enter "frombottom" or "fromtop"
% x: Y1 R# y' Y' }+ t% z1 @var verticalpos="frombottom" 5 K- X" K3 k! U4 b7 P- n4 G! Y
if (!document.layers) $ B8 J9 X- L* D$ _ ]$ s
document.write('</div>')
/ r$ C1 U- F& h! G0 C8 xfunction JSFX_FloatTopDiv()
; g$ [; ^) i# H) [3 b{ . ~+ q9 o& H8 D# [
下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。 9 c- _: o6 Z+ I
var startX =3, / `& S# q, \) O
startY = 250; * h( }! I% a( }8 p
var ns = (navigator.appName.indexOf("Netscape") != -1);
: l" B# m8 ?3 m2 ]3 Q var d = document;
8 b$ Y. _; d9 I function ml(id)
2 E- J. @& K2 A& M' b& V {
. D) J/ U3 a* f2 K/ L# f) B var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
2 P; Q8 p9 u4 [: a1 v; L3 m if(d.layers)el.style=el; 7 e& ^' Q: p3 h' `/ |* z
el.sP=function(x,y){this.style.left=x;this.style.top=y;}; / g* _# o, o8 A& F# N$ D
el.x = startX; ; G; z# V0 k) n6 Y3 o: a4 o6 u2 I: Y
if (verticalpos=="fromtop")
8 v" r1 V) Q8 y3 H) x el.y = startY; 8 G9 s1 |1 E( a0 U
else{ * e: r( [; B0 f( \& [ c9 }% G U5 T
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight; ' I) h) @4 n6 _3 b( h) I# e: ~
el.y -= startY; " T" n5 O2 W( ^3 d* H3 {# p
} ( y3 s& s7 r2 g8 v1 V2 J
return el; 0 {7 w: F8 m; l0 o; W$ J
} 3 p4 V) e9 f& c4 m8 A, K& B
window.stayTopLeft=function() ) h1 \! I0 L' R% n) T2 v
{ . T/ Z% P# o" s( M2 J T
if (verticalpos=="fromtop"){ % R/ B4 }9 E) C Y5 X+ q6 @
var pY = ns ? pageYOffset : document.body.scrollTop; # P. M, a2 ~/ y7 j& }& f
ftlObj.y += (pY + startY - ftlObj.y)/8; ( k& A$ g, c$ D) A1 m/ c; O1 A y* b
}
3 g/ P g ?# c else{ ! m6 L$ t+ r8 c0 g! K2 H
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
* ?6 r; ^ G: z( L ftlObj.y += (pY - startY - ftlObj.y)/8; / w6 _7 E; t8 {7 W
} - J/ D8 D1 K+ c6 g$ T5 p
ftlObj.sP(ftlObj.x, ftlObj.y); & O. S) C! e5 d8 I
setTimeout("stayTopLeft()", 10);
4 G1 u/ {8 H: i) l }
6 U* R8 t: M' n7 r7 S ftlObj = ml("divStayTopLeft"); 8 L/ f I; Y* R$ {2 i, S; w' p
stayTopLeft(); % j q- X1 v4 y* n5 ?
} ) Q4 Q2 C9 V6 H( R; o9 b
JSFX_FloatTopDiv();
, ~, W: B1 ?% |" s</script> 9 m' i4 c9 @2 L. o9 P5 \
</html> \5 B3 L5 e0 v# J! G
第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。
# _0 N" T$ h" j7 Thttp://imis.qq.com/images/wpa/images/kefu_up.gif & `5 A- P3 s- U3 \$ t% T; m1 h
http://imis.qq.com/images/wpa/images/ kefu_middle.gif : f {9 d2 {* x' y5 s8 T
http://imis.qq.com/images/wpa/images/ kefu_down.gif 3 x' Y9 C6 G# Y/ T k7 L5 e/ t3 D
http://imis.qq.com/images/wpa/images/ QQonline.gif
+ F7 K) ?: ?$ |; fhttp://imis.qq.com/images/wpa/images/ QQoffline.gif
( I' |; ?$ s- k% Phttp://imis.qq.com/css/im.css
1 z4 e8 e+ U! u! o5 p' m) L; E8 E6 r第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |