|
浮动QQ在线客服&网站QQ在线咨询
* a& X$ `7 c1 E1 o& f4 S第一步:先把以下代码保存为kefu.htm
, ^8 D+ y2 }( O y( u6 w% f第二步:按橙色说明修改 : [9 n) z1 b0 D5 a$ N* v: f
绿色部分是要修改的内容,html文档中不包括说明文字:
4 L) ?* b& X* o' T r& ]. L9 }" x<html>
3 ^$ t6 W; _- k7 o$ ~# c<head>
! d* E) S+ H ?% |/ b<meta http-equiv="Content-Type" c>
8 b0 l) j& i; H/ r2 a5 _<link rel="stylesheet" href="images/ im.css" type="text/css">
* |3 t2 j, X1 S% \0 B+ p9 Z2 m0 y</head>
* r: s- g) I7 [2 P<script> - [$ `6 N9 f; @
var online= new Array(); : b: N4 b5 ~* d. P9 v; r
if (!document.layers) 9 F1 S% \6 ~! \% f" x! M: B
document.write('<div id="divStayTopLeft" style="position:absolute">') % @9 P# @3 F' q& R0 I" }- l
</script>
3 X+ T$ I' A- m; c2 {8 n<layer id="divStayTopLeft"> " s9 K, F9 I4 _
<table border="0" width="110" cellspacing="0" cellpadding="0">
/ P% h6 g) M# a<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr> ! p. g$ ^, a$ O
<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script> , ]2 ?0 l8 [1 _
将绿色部分修改成你的所有客服QQ,多个QQ用半角冒号隔开,最后一个QQ号后面也必须以半角冒号结束
1 J, X' K6 e4 J- f ) X9 k7 P( }# A
以下部分显示第1个客服QQ,注意:online[0]
- m7 j$ ^$ O3 o. _( h/ n<tr><td valign=middle background=images/kefu_middle.gif>
5 D3 H6 A9 V( j0 o<script>
% }' `7 |% Z& G' P+ nif (online[0]==0) 4 z" Z2 f9 s% l- I E6 @
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>");
% S: Y" O+ T% @else
$ ?# e6 W0 G2 {4 [% D9 X. Kdocument.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>"); 9 k4 P* D4 V- a9 ~4 p) J5 y; J Q t
</script >
& C4 J, X& P+ D# R: D</td></tr> - b3 y9 ]4 q7 Z4 f5 c2 W' i& Q
6 x9 m9 _, _; v以下部分显示第2个客服QQ,注意:online[1]
% E8 z/ D6 e" }* E<tr><td valign=middle background=images/kefu_middle.gif> 3 I N5 Y. x, l
<script> " z) D1 c8 [/ K
if (online[1]==0) ! b9 ?* H, `( H% Q
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>");
* k- Z- U' j: r [else
4 i- J( c! s9 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=27043921&Site=在线咨询&Menu=no' title='在线即时交谈'>技术支持</a>"); + m! y$ E( ~ h. `. W# K5 p
</script >
( g+ X% l4 s% y* f7 @7 G% |6 u) J- _</td></tr>
- @: d0 g; T. A g% F0 y! k * k7 C! b4 B0 |4 j7 q
以下部分显示第3个客服QQ,注意:online[2]。
; o. X! M- Z( d" n; U<tr><td valign=middle background=images/kefu_middle.gif> " t3 \2 l0 z/ V: `" V
<script>
" u8 M2 L- S, m3 ]+ Y; X- b! rif (online[2]==0)
2 b: _/ g/ b, Adocument.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>");
' f) N8 W8 V# ?: uelse : j- u P0 @# F& j 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=240434782&Site=在线咨询&Menu=no' title='在线即时交谈'>代理合作</a>");
/ H4 F6 Q1 l0 S- N/ O</script > % F$ m# |* r8 }; q
</td></tr>
/ `. l+ [, r) j) S- j+ y/ Y: p
' X8 _- J7 `; F/ i多个QQ,按以上规律复制上面的代码后修改online[0] 中的数字(第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2],以此类推)和QQ号(每组代码中有2处位置改为QQ号、2处位置改为昵称)。 ! `; I( K! Q7 [0 D
8 ]0 ?- e$ i$ e. M<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
0 H5 s* w. N$ u</table>
% K1 }# t) w. H. d2 p9 G. b</layer>
3 ?( X" ?. W1 m P" A<script type="text/javascript">
4 n% q, r0 O4 m$ F8 w6 B+ C//Enter "frombottom" or "fromtop" J, |- K e1 N
var verticalpos="frombottom"
Y2 ]8 B! z% l" l. ? c# O. |if (!document.layers)
/ n& ?* N, d! I- J. k/ l/ Adocument.write('</div>')
8 q f7 T! A- L9 F7 j% m* w- Mfunction JSFX_FloatTopDiv()
1 u4 n3 M7 g% \9 v$ L& B" }{ % l+ R$ f+ G6 _4 V, Q @
下面的var startX =3是水平位置,250是垂直位置;默认情况在屏幕左侧显示,若要改为右侧显示,修改3的值(var startX =3改为var startX =screen.width-150)即可。
( F* T$ K$ A( a5 n var startX =3,
/ w# A1 }7 q9 H$ u; A startY = 250;
/ r0 `6 y' Y0 z% o0 c% S, b/ r var ns = (navigator.appName.indexOf("Netscape") != -1); , |; Y$ _5 c( l* g( E) D
var d = document; $ Q& o7 D4 {' w* s% Q b& w' \
function ml(id)
J3 d3 V0 z: J { & Y5 K5 @1 \7 x, ~0 e
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; . T/ O( A$ r) _0 D# v+ e
if(d.layers)el.style=el; ! q7 E( u3 L9 b4 `8 m+ Z8 @
el.sP=function(x,y){this.style.left=x;this.style.top=y;}; . a2 ], `1 t+ B+ H7 _7 v7 m9 B. y
el.x = startX; 0 E: F- z) m4 p, C0 P7 n
if (verticalpos=="fromtop") - m1 z5 g1 _ K7 j- O8 M4 ]) w
el.y = startY;
( ^" z" E" ^9 D* n; D: w else{
, F% P. @& D9 z O el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
( R8 L% Z% U3 w7 O- N el.y -= startY;
+ n# Q% P% d" {$ e! X& r } 9 F" ]( g/ m- f- h: E8 N
return el; % _6 @& `* X, {% a6 b
} ; @+ x) F! j3 O; y. n
window.stayTopLeft=function() ; ^ p' U$ H( v7 s3 l, {# v
{
% {5 h- g' ^5 J# a& \: J- A! F if (verticalpos=="fromtop"){
8 A5 R( s* ?* E2 C- _ var pY = ns ? pageYOffset : document.body.scrollTop;
- F: \3 ^3 A6 [/ E/ G9 U. B2 d4 M+ Y ftlObj.y += (pY + startY - ftlObj.y)/8;
4 }5 |( Y8 g7 g* ? }
% H a$ @+ ] I& k, v else{ ) ~" K! J r0 | T; l6 [
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight; 1 k2 i' m+ l9 A! J" h
ftlObj.y += (pY - startY - ftlObj.y)/8; 4 |' Q/ j- r4 W: g3 w# B- l" ]
}
3 U% D+ w3 _, P: h ftlObj.sP(ftlObj.x, ftlObj.y); 6 B1 ^3 e7 s" T$ r
setTimeout("stayTopLeft()", 10); ; `8 H% |/ @3 Q$ D: k
} " o2 H% Z* f' S8 @( y5 q/ \/ Q
ftlObj = ml("divStayTopLeft");
4 [1 Y" _. j+ v. I% Q stayTopLeft(); : _+ _9 n S$ K3 L" b
}
6 C. f. K( H( W: g [9 |JSFX_FloatTopDiv();
9 J+ P2 k# d# a6 p</script>
' F. w7 f/ L2 ~# T7 n</html>
1 F% P- g! Q4 `; E0 S1 g第三步:下载相关素材(在图片上点右键-图片另存为…),保存到images目录下。
3 J2 h) Y1 N% v j" r# r; {http://imis.qq.com/images/wpa/images/kefu_up.gif " [. f7 ]! v7 T3 b" j+ V
http://imis.qq.com/images/wpa/images/ kefu_middle.gif
7 }0 l3 @3 l! Y1 _- a0 mhttp://imis.qq.com/images/wpa/images/ kefu_down.gif
5 b( f& h' `8 ?, L) W2 M' e9 ~http://imis.qq.com/images/wpa/images/ QQonline.gif
F8 v5 g6 Q2 l. N0 A7 Ihttp://imis.qq.com/images/wpa/images/ QQoffline.gif 3 X& `% O5 ?( ?- p" e
http://imis.qq.com/css/im.css + h) g+ U% J& G& g
第四步:将所有文件和目录保持原有结构(kefu.htm和文件夹images),拷贝到您的网站目录中,在你要添加“浮动QQ在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"--> |