|
浮动QQ在线客服&网站QQ在线咨询
) [3 a2 Z( n7 |: V# h! f第一步:先把以下代码保存为kefu.htm + K) W k& b, {# M
第二步:按橙色说明修改 , Z) t$ j/ ^0 p* T) t
绿色部分是要修改的内容,html文档中不包括说明文字: : V( b* D+ A- H
<html> ) r5 M1 r6 M; u) F! c
<head>
7 g2 `& |- u3 K( @5 U* S4 j<meta http-equiv="Content-Type" c>
( B' ~# M, f0 {% Y/ U<link rel="stylesheet" href="images/ im.css" type="text/css">
: o1 t% i: Z- ^; b/ ?; }, z</head>
0 q1 T9 X4 a, A3 X3 u; V" H* w<script> ! a: ]2 D/ Q# \# q
var online= new Array();
3 V1 k' H; k) \) x( I5 @if (!document.layers)
+ r2 _9 {- O; Idocument.write('<div id="divStayTopLeft" style="position:absolute">')
7 a' r! R: l3 D# D% e; v4 T% W- w</script>
! {, u0 M% K5 F& [! r; t<layer id="divStayTopLeft"> ( Q; A' w( x) }
<table border="0" width="110" cellspacing="0" cellpadding="0"> $ \" e$ E- s0 C* c9 Q
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr>
9 i, {; m9 F' Z8 b6 j* }) K<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script> 1 ~6 E4 A* C, u4 L
将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束
% q0 B3 q/ u9 A9 b0 _& E7 g: ?
$ T. z! F; y1 d0 o以下部分显示第1个客服QQ,注意:online[0]
. Q: w* Z: t* x3 R% A3 h, \: c<tr><td valign=middle background=images/kefu_middle.gif>
2 ~; G; ~. l' F<script>
+ Y4 P( U, [1 M) q) m' Oif (online[0]==0)
7 A6 U6 Q: B4 Z- ?5 {6 Z! G( t- h5 Qdocument.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>");
) P- h, G8 c. L0 ?9 d& s9 E4 Helse 0 A7 |' i1 n" w: A) F) K9 L; c/ O( ~
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>");
% i% k+ ?2 {" I" O7 }1 d3 y) K# `</script >
6 a2 e% l) D% g, g X6 ]</td></tr> $ W6 h7 g y; X! C/ C+ P
* Y1 l4 W1 w3 V+ J/ a以下部分显示第2个客服QQ,注意:online[1]
; N* [0 N5 W/ Z* v7 C! w) c/ g<tr><td valign=middle background=images/kefu_middle.gif> ) D/ Y5 X ], V5 }
<script>
7 O( h* a" w" K( w5 dif (online[1]==0) $ d* h2 R# D+ F
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>"); 4 ~3 f9 m0 v# J9 W; y
else
1 x5 t9 Y, C' f( v* l4 A; k1 `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>");
. F- {8 L3 p* u; _/ D</script >
+ K% t& B* t+ `5 f% \+ N2 ?) W</td></tr> ( L# a, M( P/ q! H6 x, r/ `+ v
; Y/ s& ?+ l9 V
以下部分显示第3个客服QQ,注意:online[2]。
- b( h5 S- q) A) a2 v<tr><td valign=middle background=images/kefu_middle.gif> # c+ x* J: u# N% @6 n
<script>
$ V% K2 T7 g; lif (online[2]==0)
, |, s6 d# \, g# 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=240434782&Site=在线咨询&Menu=no' title='客服不在线,请留言'>代理合作</a>");
: [: k8 @ \% [7 X9 zelse , l# s" P/ D w# O( U! C% _/ 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=240434782&Site=在线咨询&Menu=no' title='在线即时交谈'>代理合作</a>");
" w( }6 x* B1 k: |0 `1 G% r</script >
2 m3 S- @; i' w$ b! l3 A</td></tr> " s6 A5 x9 J# j# `. X
3 j0 ~7 |3 A# \% Z8 z1 H& Y4 `
多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。 6 T% f5 _5 ~& f8 ?/ ?9 m6 O u
+ O- o4 w- k, S/ u3 `5 s
<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
! x6 N9 N: I7 N) C# u9 A</table> 8 P: ^6 ~" Y2 O' o# k
</layer>
" e8 x8 ^6 b$ z3 |2 a& g# D<script type="text/javascript">
2 k; i: w1 }9 m! U) K9 c# J//Enter "frombottom" or "fromtop"
9 e& c3 s2 Y% ?3 k1 v7 O. Dvar verticalpos="frombottom"
. {3 ^; v6 n4 K- R5 n* L! }if (!document.layers)
! j d9 i6 P. kdocument.write('</div>') + J6 b k9 B- g$ t
function JSFX_FloatTopDiv() ; u6 O% P- P! k4 x$ B% a% y
{ ; O& r; a3 ~2 S7 K& _
下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。 7 Y9 s4 o2 I0 u2 U y
var startX =3,
% q/ f5 A5 c) m) |: H/ m startY = 250; 2 {- i( V0 J5 M0 V( I
var ns = (navigator.appName.indexOf("Netscape") != -1);
4 }, r' l; g& N var d = document; 3 H9 J) j4 K/ P3 b3 R' T
function ml(id)
- w' \: D# M9 B {
( G ~( x# h$ O3 ^2 `' S var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; ( a' O7 L# r+ H( u' x' x8 F
if(d.layers)el.style=el;
# K. `, a7 @ e el.sP=function(x,y){this.style.left=x;this.style.top=y;}; - V! \: |/ [) c) j
el.x = startX; : ^5 \ I/ u/ U4 M, s# Q2 d
if (verticalpos=="fromtop")
- a4 Z6 P9 v, o1 }+ ~6 Q9 T) S el.y = startY;
" W5 O0 e8 {/ @3 `0 P, }" T else{ ; R# h$ s: |. A$ c3 R, s3 |
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
. B# T1 D9 Z: d( ?! P$ `# o el.y -= startY;
, u, _( g- A* V5 E5 r }
) g: t8 |- m. J; J; r( ~ return el; 7 N+ a4 B' o9 y. M0 ]) p2 C
} ! }9 V) f3 @; P6 ?$ e
window.stayTopLeft=function() 1 }- O8 m* B# M: X1 r
{
0 q; ^" D5 c- P ~9 k if (verticalpos=="fromtop"){
/ E2 S! v u* H0 s" h- ^& H3 K/ X var pY = ns ? pageYOffset : document.body.scrollTop;
' C; q6 u3 z4 \+ Y1 N ftlObj.y += (pY + startY - ftlObj.y)/8; ! y: n) T ^! V }* u* \
} ; Q1 b6 s# v# s. o u
else{ , Z: f( m) J J- d3 ^" S9 q3 v
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
1 O5 [1 ^7 Q: ~: X ftlObj.y += (pY - startY - ftlObj.y)/8; . @% [0 X" d; M' l/ s# e; T
}
5 u4 K" P) M$ ^5 m6 a+ v% B w3 W ftlObj.sP(ftlObj.x, ftlObj.y); % A2 |! S( T1 f1 {
setTimeout("stayTopLeft()", 10);
1 X) h/ w2 T) h9 O }
5 u- p8 V1 U+ ?" O* M" d, V ftlObj = ml("divStayTopLeft");
7 c; F6 B: X* s/ T stayTopLeft(); : d/ B/ o, K% q" g E
} ' ?. I8 e. b5 }/ l' z
JSFX_FloatTopDiv(); 2 S" n6 ^0 l; x6 P$ M
</script>
5 y4 B h3 ?# f% r</html> * j9 Z& S* C! G% {" a
第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。 + F3 b* a6 ~; H% s
http://imis.qq.com/images/wpa/images/kefu_up.gif
$ u I, R. `8 z) T1 j7 H5 o% `http://imis.qq.com/images/wpa/images/ kefu_middle.gif , c& {- \1 |# ~! H( q/ N
http://imis.qq.com/images/wpa/images/ kefu_down.gif 3 `" t( P0 j; b& w! I F1 K
http://imis.qq.com/images/wpa/images/ QQonline.gif
& J% W& R- L5 I+ _http://imis.qq.com/images/wpa/images/ QQoffline.gif ( T/ ?( E3 n' d, `* ^ D
http://imis.qq.com/css/im.css
( I0 N( U' e7 e6 h* Q第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |