|
浮动QQ在线客服&网站QQ在线咨询 8 ]5 A4 z/ V4 Y, S
第一步:先把以下代码保存为kefu.htm
& O3 o7 M8 Y' p1 t& n6 q3 \! |第二步:按橙色说明修改 " r+ e& q/ |9 q2 X, w j1 m/ ], O
绿色部分是要修改的内容,html文档中不包括说明文字:
# Y9 w5 R( \* W" y* M7 x<html> + ~/ @5 i2 w1 `, v
<head> - R) \4 \" x4 m1 z6 d9 S
<meta http-equiv="Content-Type" c> ; ^) c% w$ u0 p! v
<link rel="stylesheet" href="images/ im.css" type="text/css"> " I1 K c) n3 l8 g( W
</head> * [# l2 a/ d$ _' O& V$ ~6 @
<script> . h: F7 j- a2 S
var online= new Array(); ' \* F3 V4 ]# h& O) T
if (!document.layers) " I$ R3 D" v, z |
document.write('<div id="divStayTopLeft" style="position:absolute">')
# Z( o; x4 x: U2 M4 r</script> 8 P& T+ \6 a- j4 B0 u9 w" n1 Z
<layer id="divStayTopLeft"> & E$ S" n' q" \. K8 H' Z) o
<table border="0" width="110" cellspacing="0" cellpadding="0"> $ w ?& Y2 v$ [8 Y( T, `4 a
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr> ' \2 P: s5 v8 j
<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script> 9 _6 Z1 F1 y; [* _/ a
将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束 * x# Q+ o) E ~- F% Z" c
4 s4 h( Z5 j) Q以下部分显示第1个客服QQ,注意:online[0]
5 t, |: r1 P& Q' B<tr><td valign=middle background=images/kefu_middle.gif>
5 w5 [0 w' X. a5 u: _3 \4 u9 B0 V<script>
! G# R4 D# d2 R D+ T* ]& Gif (online[0]==0) 1 t! j6 @8 l! U& E0 J
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>"); / h, k" E/ p( Y O( E( B
else $ ]9 U# d1 m5 w2 A9 ^* e2 m4 `
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! P3 r1 m3 e" W$ K6 G
</script >
* v) d+ W( p3 k! B0 O</td></tr> 0 v9 E. C* A9 }4 L$ }& ]. r4 G# W. b
) C- x1 v3 ]7 ^9 ?, W1 @; U
以下部分显示第2个客服QQ,注意:online[1]
" ^) U/ Z! q; |6 g# E<tr><td valign=middle background=images/kefu_middle.gif> , y1 Q# s2 Y4 C Z+ o" f
<script>
2 r8 a X) h6 }' s$ iif (online[1]==0)
# N8 y& k6 n* ^- u+ A. gdocument.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>"); ) ?2 C/ P) b1 w8 t! L
else 9 n# v8 z! o2 F2 S
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>"); - b1 s* R5 j6 z8 p- M
</script >
7 j+ z6 Q' \. z</td></tr> - f/ r6 r# |( X& S
( T* p# z8 b9 N8 B8 _5 k1 f( W以下部分显示第3个客服QQ,注意:online[2]。
2 Y. E, ~* s" g<tr><td valign=middle background=images/kefu_middle.gif>
3 a, k2 l. f! @' y7 g" w8 L<script>
; N2 R2 j4 S; \) Bif (online[2]==0)
. c; W$ T7 G: o3 F7 n/ ndocument.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>"); % b& N( z# v0 m$ a1 G. {. q
else # F0 s- E1 C k7 A
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>");
6 p$ n+ ?% o/ n! u8 E</script > ) O0 n# V0 c+ h" K7 z' A/ K
</td></tr> 8 L+ U: {3 K- O* ~ c: m
' | ]$ _1 Z( i; {9 y9 P% x+ @- C' v
多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。 ! x8 ]3 K1 K; G. h# d7 U1 G
5 i* `0 Q5 Q$ |" b- N<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
- l; \* ^' [) M* m; J% w5 S. Q</table> U2 _* H% {5 ~5 {
</layer> 3 Z5 \8 w8 S! }, i1 Y) A
<script type="text/javascript">
! V3 z5 v4 p$ W1 M6 ]4 O//Enter "frombottom" or "fromtop"
% O: o) w0 _& I7 l- ^var verticalpos="frombottom" 7 N3 g8 F! m' E& S9 t2 T5 b
if (!document.layers)
% V+ w; Z) I+ `9 O+ j4 [. ddocument.write('</div>') U. w! b0 m9 e, ?+ ~' \( ~
function JSFX_FloatTopDiv() 1 g/ \ }) A" E4 d4 ?
{
& p2 U. E$ e) x* z下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。 : J9 }) J5 M4 g5 a$ y* i
var startX =3, $ V- w* ` k- `: M- v* C
startY = 250; ( U: u4 s' [3 S5 h4 ?1 s
var ns = (navigator.appName.indexOf("Netscape") != -1); 9 J6 H' |- U- M0 j* m* H% d
var d = document;
6 O$ s }7 ], }6 \5 J, Y function ml(id)
/ A% ~+ n* Y" b' ~0 B- ^8 f { : K4 l# }/ h1 Y$ `7 b
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; . Z( j0 h3 w! z5 n c- C* j8 `
if(d.layers)el.style=el;
& [7 V' E* z+ E8 T el.sP=function(x,y){this.style.left=x;this.style.top=y;}; $ z7 X$ V3 M- r* ^. v& @8 s; U
el.x = startX; Z( U8 X; w: ^: `* @) q! S, g* ~5 p
if (verticalpos=="fromtop")
+ l; O$ [$ X: ~1 n" o. ?' J& L el.y = startY; 9 l# E; _8 S8 R# i0 Z8 [# k2 Z
else{ " D% [! J1 a$ h& D5 }& Q! m
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
" D P8 @) z% U+ S$ ^5 t el.y -= startY;
' i' C: W) q: j6 R' k4 Z8 u } . y3 G' L# s% G
return el;
7 ]" Z% O6 X; e3 Y5 I } . [* ?6 S H- Z) S+ q$ ^4 W$ t
window.stayTopLeft=function()
" ]* F4 h& A/ X+ { {
: b( |. r! K4 {9 }$ e+ X7 J if (verticalpos=="fromtop"){ 3 n: }7 X, B$ H6 z+ N! i: ~5 W
var pY = ns ? pageYOffset : document.body.scrollTop;
2 s- S6 m9 u, \ ftlObj.y += (pY + startY - ftlObj.y)/8; " {' I# {: L N: C7 C
} 7 z3 S1 y" b# p( H) N$ d9 r, m9 o
else{
~- @* b0 j' Z7 N: D5 e1 o var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
, I& F/ j& e W3 {/ O8 z% n8 G ftlObj.y += (pY - startY - ftlObj.y)/8;
0 G/ f" F! ~+ ?$ X } 0 Y; e* F1 [! S; K
ftlObj.sP(ftlObj.x, ftlObj.y);
7 h+ U. |. T' z, w setTimeout("stayTopLeft()", 10);
% U$ H8 F1 \& a6 Z }
0 F. Q4 ]# t+ m: z% K1 m3 x ftlObj = ml("divStayTopLeft"); y& V6 f" n2 @* F3 }
stayTopLeft();
+ L/ E" h, g) v6 t}
$ [8 H3 C) X6 k" \, ~7 xJSFX_FloatTopDiv(); " l& M! h! a( @: q
</script> ) @6 ~: n( Y8 }; C
</html>
6 ~; E. b+ T/ p" S% R5 [+ F+ i第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。
1 h/ y: {4 l: F9 x! m1 Ohttp://imis.qq.com/images/wpa/images/kefu_up.gif 3 } ?- Y, m# E; g( G
http://imis.qq.com/images/wpa/images/ kefu_middle.gif $ _; J3 C- |9 l- g" V) n3 K
http://imis.qq.com/images/wpa/images/ kefu_down.gif ! x" M# L S( V& m M. I; M. I
http://imis.qq.com/images/wpa/images/ QQonline.gif 5 M: u2 R; G% Q: X5 x4 F9 G
http://imis.qq.com/images/wpa/images/ QQoffline.gif / H" H) a% A. c) R8 s2 Y( N4 j
http://imis.qq.com/css/im.css
! L; z6 E% N1 G7 q3 Q第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |