|
浮动QQ在线客服&网站QQ在线咨询
. h4 h1 M" {% _7 y: T第一步:先把以下代码保存为kefu.htm
4 @' D7 W- k7 C3 r! e' `2 a第二步:按橙色说明修改
. E' y4 r/ g3 K: F4 B3 `) e绿色部分是要修改的内容,html文档中不包括说明文字:
e" l" d, B$ P. _<html> 9 `3 r) O% V) Z* p& e
<head> 3 d7 ?- b6 z+ t+ J3 ?) q
<meta http-equiv="Content-Type" c>
W- @! ^0 v: L D6 S4 [<link rel="stylesheet" href="images/ im.css" type="text/css">
, n! _+ w% H! h, t n</head> - i$ c. j# P8 |
<script>
9 Y- B8 H# A; U4 avar online= new Array(); - c; B/ I$ v/ b$ m- ]
if (!document.layers)
$ D$ B- `% i$ Q. h& Xdocument.write('<div id="divStayTopLeft" style="position:absolute">') ) c+ U7 h* y) C2 a( n
</script> 4 e! t' _( N' |4 R$ s
<layer id="divStayTopLeft"> - L9 j4 Y3 K4 B
<table border="0" width="110" cellspacing="0" cellpadding="0">
6 ?2 K3 p4 x2 p% a' y3 U' y<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr> 3 ~& P( f4 j1 J) I2 m. b
<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script>
! S% G& n! r! R将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束
$ f( V+ M, p) T
$ O( a! R3 H* C! u. C% Z以下部分显示第1个客服QQ,注意:online[0] % c8 o2 B4 r7 C" w0 ~, `
<tr><td valign=middle background=images/kefu_middle.gif> . b9 \; V% ^, ?* Z
<script>
2 `- d0 {* V- P* Y) Lif (online[0]==0)
* W0 Q9 d z/ W( p( U9 i% c- |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! P1 Y4 t3 o4 j
else
9 S9 B/ g8 u% d! K4 |9 {) Z7 \# Wdocument.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>");
1 P4 k9 q9 h/ c$ W* _/ q% s4 P</script >
1 j% L$ Z% y6 f# B/ ]& b9 _; e9 g3 \</td></tr> 5 b% ]/ i2 V" t% w( b2 ^ O
$ l; {) y2 y! {& d0 O+ U
以下部分显示第2个客服QQ,注意:online[1] + N0 S- Q2 N% X6 `0 r
<tr><td valign=middle background=images/kefu_middle.gif>
+ c3 `4 v/ B: q<script> 9 I* M4 M8 D3 _: T. e0 {: t
if (online[1]==0)
; k" v2 h) u, i) L' o. D1 R1 [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>");
5 m3 p' w- X6 ^$ [* _else
/ s8 O( ^3 J) f, p0 y5 x& U9 r: ddocument.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>"); ) S5 o* }2 G3 c7 I! y
</script >
! F$ `' e6 K5 F3 _- f</td></tr>
: T) T( N$ }" ^9 T
; ?$ M0 W: Y7 W8 p# ~! U以下部分显示第3个客服QQ,注意:online[2]。 1 g' r( b$ ^8 Y; h
<tr><td valign=middle background=images/kefu_middle.gif> / b) h, Y+ U6 R+ `! n
<script>
! K, O: `6 O# }! H. e: b3 {2 uif (online[2]==0)
2 U- z9 q& M: a2 Vdocument.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>"); ( K- V* z! o9 E) X, |8 f) L
else 5 T& p. H% [: F; O: n' a& f; j0 U( F
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>"); / Q) R+ j0 a6 e; R
</script > . w& C- R( V" f) b! r: r. W' H
</td></tr> ]* c" E/ g- K/ I D9 m/ `0 |3 Y& X
* ~ q8 {, v$ Y# p1 L0 ?. o多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。 2 b4 ?: L/ {' B) S6 m+ A5 ~( j8 m
, @" J/ o' t$ ], l# H7 G% V# I' T% H5 Y
<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
4 x, ^5 @7 M$ w) }4 S/ \</table>
) a, ~, U1 d% r0 h7 j8 M</layer>
4 [/ Q1 R( j9 {( z: V% X# A l2 w<script type="text/javascript">
; A; m8 r9 n+ h; q* A' W//Enter "frombottom" or "fromtop"
: I# Z- N" Q6 {$ R1 @var verticalpos="frombottom"
- h# I0 Z- G+ s+ wif (!document.layers) 1 P8 x9 p7 K7 J+ j2 c1 F
document.write('</div>') ' T5 _9 g/ F4 H, w% N
function JSFX_FloatTopDiv()
% w' U; M# D7 }+ S( ]( V1 P: {{
. r* T% `% l) Z5 S6 B下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。
$ @+ C/ n% d2 R# `. ] var startX =3, , S6 V, X- C" u& _1 e# c/ }
startY = 250;
" Y9 B! Z- P# a4 u* [. f v var ns = (navigator.appName.indexOf("Netscape") != -1); * u, M# u3 y; \: j) }9 k6 t
var d = document;
N7 \- p8 i. y% ?+ v: ?6 D2 a" k- @ function ml(id) K, j3 H* ]7 x; ?2 K/ S
{ ) g4 i. }1 i- t( h
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
/ O. x; _: `. |- U2 e$ j if(d.layers)el.style=el;
& O. Z A6 }2 N el.sP=function(x,y){this.style.left=x;this.style.top=y;}; # X9 R& Y2 V8 F5 k
el.x = startX; 7 q" X( @, q) u' Z2 T# ~
if (verticalpos=="fromtop") 3 _1 A6 i1 M$ Y. y W; C# R
el.y = startY; 7 I$ f1 y$ P+ ^+ I b
else{
/ A5 W3 s' W2 I5 N0 h6 h el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
4 x* R( b6 K" @% a* _1 q& E el.y -= startY;
3 V5 F$ r0 @; h( Y2 k# c }
7 \( t% O! E8 b) G$ a return el;
/ O U# J1 `* w$ i, p4 `! e% C# E }
4 S4 m/ R+ q! R( W window.stayTopLeft=function()
% @4 }0 ~- j0 D- U1 } {
$ d7 K% e- _% {6 r if (verticalpos=="fromtop"){ ) E1 L+ Y' t" u' L/ B; I4 k# u. s
var pY = ns ? pageYOffset : document.body.scrollTop;
5 K9 n9 Q( f4 o7 f+ D2 e3 m ftlObj.y += (pY + startY - ftlObj.y)/8; : t5 |" m+ C/ D) Y% z7 Y! s. }
} n. w5 F9 b' n$ T
else{
0 a6 h1 H+ Q6 \, _ var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
3 w2 p; e) R+ h( K ftlObj.y += (pY - startY - ftlObj.y)/8; 5 l( E2 O9 ^- t/ H: v% h) D3 @* h6 \
}
1 n; ]( Z" W, Z: m' O$ \ ftlObj.sP(ftlObj.x, ftlObj.y);
w# M4 X% G3 K- h R, R setTimeout("stayTopLeft()", 10);
6 P$ k& a% q' _( I } 1 N- N4 ?: B5 D; k4 ~
ftlObj = ml("divStayTopLeft");
6 f/ }, G) l. w% X6 t v- f stayTopLeft();
) [% R9 X# j$ b! _ y+ S}
0 s2 m9 h, m! }JSFX_FloatTopDiv();
1 T2 u5 D8 z8 W& ]! h, Q</script> $ X, t( i1 l9 c
</html>
+ p( E1 n# P# @2 Q5 \% X第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。 # K* t# s6 s3 D. @* J+ ^* ?
http://imis.qq.com/images/wpa/images/kefu_up.gif
. S+ y! g9 C0 ahttp://imis.qq.com/images/wpa/images/ kefu_middle.gif 6 D. @& }- B6 n2 m- b# L' a) q) w
http://imis.qq.com/images/wpa/images/ kefu_down.gif 1 a- M5 \2 r" N a
http://imis.qq.com/images/wpa/images/ QQonline.gif
3 B# E+ I" J6 }/ e. j8 k, S; \http://imis.qq.com/images/wpa/images/ QQoffline.gif / {. H+ T* F7 O' z0 |# P5 h
http://imis.qq.com/css/im.css
2 \3 F( E2 R9 E9 C第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |