|
浮动QQ在线客服&网站QQ在线咨询
" u$ q0 r) i: D第一步:先把以下代码保存为kefu.htm ! [# n/ v4 _4 w: g$ s+ }
第二步:按橙色说明修改 0 |6 Y2 j2 ? C8 W6 k5 A
绿色部分是要修改的内容,html文档中不包括说明文字:
0 G+ I( ^3 R; Y6 |9 T<html>
; ~+ Z+ e) E, W$ h/ C* X<head>
7 z6 s3 v9 ~% R+ k<meta http-equiv="Content-Type" c> . \; y3 c5 m& G' Z, q
<link rel="stylesheet" href="images/ im.css" type="text/css">
. }' @" J% k6 V. ^8 T; E: U' }</head> / N* i3 A/ `, C
<script> ) B2 U/ q! m6 u1 M
var online= new Array(); 3 \% @6 t. H+ L1 w6 P" g: {
if (!document.layers) ) C5 _0 L- E- L! |) K
document.write('<div id="divStayTopLeft" style="position:absolute">')
! C! ?! T- l% h) m# I4 N</script> - Q V8 ~+ ] t I6 x
<layer id="divStayTopLeft"> & e1 G$ S" d! _% P
<table border="0" width="110" cellspacing="0" cellpadding="0"> . L/ f, }. f0 I8 m8 @" d( C0 K' i
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr>
! ^5 a+ T! p) u+ v3 u<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script>
E, l! }1 E. N" _8 y! j将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束 ( S: P( R+ k R6 o) Z
/ Q4 d2 H, s) ?/ u5 Y
以下部分显示第1个客服QQ,注意:online[0]
! E' N: @) d% j3 d m2 y' i) @6 f<tr><td valign=middle background=images/kefu_middle.gif> % F4 V+ p0 w4 h8 h' y/ P
<script> / d1 Q/ D) o/ }5 V# r$ i9 W3 E' ?
if (online[0]==0)
. G3 f4 k$ N) c7 u* 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=27089965&Site=在线咨询&Menu=no' title='客服不在线,请留言'>售前咨询</a>");
8 C; e, t8 ?$ Velse 9 A' @+ Z! H2 Q3 L" 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>");
$ D3 m; s, B$ G- X6 ~</script >
6 Z1 S$ h) u5 m, a! o</td></tr>
' g/ e1 A% l3 { & w7 G1 p4 o' u9 o6 w
以下部分显示第2个客服QQ,注意:online[1] 9 g8 g" ~/ D1 P! X% ~: W
<tr><td valign=middle background=images/kefu_middle.gif>
m k0 d; `" ~5 y; e5 _( b$ [<script> 9 u- ^2 A2 m3 \
if (online[1]==0)
- n2 H6 U& H% n$ Ddocument.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>");
8 c4 F: _6 }/ G/ ?else
! F2 e0 s6 _ _' 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=27043921&Site=在线咨询&Menu=no' title='在线即时交谈'>技术支持</a>"); ! s& k/ ~" l, }3 A( D" l, N
</script > 6 [+ l# I( T3 _, v! A' j
</td></tr>
& P, F, g3 R3 q3 n , f! k$ X. y6 V) ]
以下部分显示第3个客服QQ,注意:online[2]。 ^$ w. w8 u$ \& e3 Y' ?" |. |
<tr><td valign=middle background=images/kefu_middle.gif>
( R0 a4 l( e$ Q1 f2 L0 s7 O<script> 7 p, G. B" k* X& R8 b# E& F8 I& U
if (online[2]==0) ) c8 O' v P+ H" R4 V: Z
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=240434782&Site=在线咨询&Menu=no' title='客服不在线,请留言'>代理合作</a>"); . `7 k; W! P; d" U2 B2 [( ]
else
4 }4 }' W6 f* Idocument.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>");
! b; ^1 J a8 t0 p2 g0 o</script > # c" C$ W* r" l( f) e, R8 L& o; m
</td></tr>
/ G% B& A# J2 S/ V/ X: _8 V: Y, k6 v8 g" Z
, h5 n9 a' z. L多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。
2 k6 ~$ H! i2 y 1 y0 h( P0 M7 S; p* a; v: }
<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr> 4 X# C$ k- A4 F& `
</table> % L, p1 h1 Z6 M6 j0 r4 b9 G
</layer>
0 d- a* H( `! I* f<script type="text/javascript">
( Z) u! m& N/ {6 O& z& ~4 s//Enter "frombottom" or "fromtop" 6 E' w: Q. G$ S! c8 f4 w
var verticalpos="frombottom"
2 t# n" f. t) J8 ^6 B' \if (!document.layers)
. {0 x' m2 C3 c/ p, O; [7 K/ I! b5 idocument.write('</div>') 7 ~: g* S. ^ A4 O, j( E
function JSFX_FloatTopDiv()
; X3 n6 x# y) b% d* p2 Z$ ~{
% |$ J! M0 a9 S5 Q下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。
! Y9 `8 V0 s8 \, B7 e var startX =3, 4 M% ~4 p5 Z# ]8 |
startY = 250;
6 Z0 q1 i$ L7 J var ns = (navigator.appName.indexOf("Netscape") != -1);
; O1 h/ _& H) V6 s: P var d = document;
& e M0 Z: ?" j5 }& D function ml(id)
+ O% w- T l( P. l/ o) y/ ] { * ]/ R+ Y% O* r% Q! W, C: n
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
) X5 ?0 ^7 s: H! x if(d.layers)el.style=el;
. m# a5 @, |4 C. R2 L el.sP=function(x,y){this.style.left=x;this.style.top=y;}; & }2 ~* j/ ?) R$ K
el.x = startX; + o( [0 t( X: m+ ?9 `
if (verticalpos=="fromtop")
! w& K# T! _; t8 c7 k1 n1 u el.y = startY;
' W9 @/ f+ l2 W2 B4 u$ u4 t else{
6 Z$ }) R! ]! {1 P0 |" D. \4 z# s, q el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight; . d: g$ s2 L: A' c+ M7 v) j) ^
el.y -= startY;
: |" O9 S2 X. y8 d6 I) y$ K' y }
, E) C% _$ p, z* ] return el;
4 M, n4 l1 V5 q3 l/ F/ o } ( F3 w ]! [: T/ E7 }
window.stayTopLeft=function()
' Y# o& J; y4 Z+ d- {6 B6 @+ j { ! `/ g# r) x9 h9 B( h
if (verticalpos=="fromtop"){ * C3 K* I" o6 ^7 r
var pY = ns ? pageYOffset : document.body.scrollTop; 9 q. v6 j, V$ z$ Z8 K& b- y
ftlObj.y += (pY + startY - ftlObj.y)/8; : K- ]: V, n6 |; `9 a/ C @
}
; v9 Z& U' T9 E# p1 D* }7 j else{ , |! B2 D2 g {8 C0 ~
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
: Q+ N( a0 d" |- f ftlObj.y += (pY - startY - ftlObj.y)/8; 5 Z7 P/ V( ^9 Z' @! ?
}
9 H) Z5 d' S; Z* s) q ftlObj.sP(ftlObj.x, ftlObj.y);
4 i9 a5 V3 Y" B) D7 m setTimeout("stayTopLeft()", 10);
7 S- d. @ b0 F3 t! l& Y# l } 0 H3 a! T! ~; y& r# t4 ?
ftlObj = ml("divStayTopLeft");
5 _' \: X* j/ f8 s5 N* O! a stayTopLeft(); % Q: X1 b1 o/ R# P- Y
} , j& @+ K- A6 j5 X* r2 v
JSFX_FloatTopDiv();
; }2 [) a8 T0 [/ d</script>
) [5 J& i( c9 _</html>
3 @3 t1 x6 [( A9 @9 g第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。 2 H9 E8 w6 m8 S! v1 g' }) W
http://imis.qq.com/images/wpa/images/kefu_up.gif ! m5 b8 h% _3 c5 `8 o! T- L8 Z
http://imis.qq.com/images/wpa/images/ kefu_middle.gif ) I& t- s7 q `4 Y" y0 K3 z
http://imis.qq.com/images/wpa/images/ kefu_down.gif . l8 ?4 m1 p4 K! u/ X0 b7 P
http://imis.qq.com/images/wpa/images/ QQonline.gif
4 p" p! i/ t$ w% O) A1 xhttp://imis.qq.com/images/wpa/images/ QQoffline.gif 3 I8 S6 y2 v1 J
http://imis.qq.com/css/im.css
9 Z% T* y: E4 T* u6 m5 ~6 x第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |