第一種特效:騰訊qq互動狀態代碼&自動識別在線狀態
將您的QQ/TM的在線狀態發佈在互聯網上;點擊“QQ圖標”不用加好友也可以聊天;尋找商機,廣交朋友,"互
動狀態"給您更便捷的交互體驗。
步驟如下:
一、打開騰訊qq互動狀態代碼生成頁
http://is.qq.com/webpresence/code.shtml
按步驟生成自己的QQ/TM代碼
二、用網頁製作工具或記事本(簡單)打開自己的網站在Html編輯器中,把你需要添加互動狀態的地方直接粘
貼網頁代碼即可。
這種方式的好處是:你可隨意設置“互動狀態”的表現形式,文字圖片隨心隨欲。
第二種特效:隨網頁滾動條上下移動的效果
浮動QQ在線客服 網站QQ在線諮詢
第一步:先把以下代碼保存爲kefu.htm
第二步:按橙色說明修改
綠色部分是要修改的內容,html文檔中不包括說明文字:
<html>
<head>
<meta. http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="images/ im.css" type="text/css">
</head>
<script>
var nline= new Array();
if (!document.layers)
document.write('<div id="divStayTopLeft" style="position:absolute">')
</script>
<layer id="divStayTopLeft">
<table border="0" width="110" cellspacing="0" cellpadding="0">
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr>
<script. src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script>
將綠色部分修改成你的所有客服QQ,多個QQ用半角冒號隔開,最後一個QQ號後面也必須以半角冒號結束
以下部分顯示第1個客服QQ,注意:online[0]
<tr><td valign=middle background=images/kefu_middle.gif>
<script>
if (online[0]==0)
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>");
else
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>");
</script. >
</td></tr>
以下部分顯示第2個客服QQ,注意:online[1]
<tr><td valign=middle background=images/kefu_middle.gif>
<script>
if (online[1]==0)
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>");
else
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>");
</script. >
</td></tr>
以下部分顯示第3個客服QQ,注意:online[2]。
<tr><td valign=middle background=images/kefu_middle.gif>
<script>
if (online[2]==0)
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>");
else
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>");
</script. >
</td></tr>
多個QQ,按以上規律複製上面的代碼後修改online[0] 中的數字(第1個QQ爲online[0]、第2個QQ爲online[1]
、第3個爲online[2],以此類推)和QQ號(每組代碼中有2處位置改爲QQ號、2處位置改爲暱稱)。
<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
</table>
</layer>
<script. type="text/javascript">
//Enter "frombottom" or "fromtop"
var verticalpos="frombottom"
if (!document.layers)
document.write('</div>')
function JSFX_FloatTopDiv()
{
下面的var startX =3是水平位置,250是垂直位置;默認情況在屏幕左側顯示,若要改爲右側顯示,修改3的值
(var startX =3改爲var startX =screen.width-150)即可。
var startX =3,
startY = 250;
var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x;this.style.top=y;};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function()
{
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : document.body.scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("divStayTopLeft");
stayTopLeft();
}
JSFX_FloatTopDiv();
</script>
</html>
第三步:下載相關素材(在圖片上點右鍵-圖片另存爲…),保存到images目錄下。
http://imis.qq.com/images/wpa/images/kefu_up.gif
http://imis.qq.com/images/wpa/images/ kefu_middle.gif
http://imis.qq.com/images/wpa/images/ kefu_down.gif
http://imis.qq.com/images/wpa/images/ QQonline.gif
http://imis.qq.com/images/wpa/images/ QQoffline.gif
http://imis.qq.com/css/im.css
第四步:將所有文件和目錄保持原有結構(kefu.htm和文件夾images),拷貝到您的網站目錄中,在你要添加
“浮動QQ在線客服”的頁面的最後面添加一行:<!--#include file="kefu.htm"-->