js调整浮动客服窗口位置:这是浮动在右边,我想调整到左边...做不好,求高手指点。

JavaScript08

js调整浮动客服窗口位置:这是浮动在右边,我想调整到左边...做不好,求高手指点。,第1张

改了一个参数,你看这样行不行,不行就没招了:

----------------------------------------------------

<!--

var mypath='',mypaths

for(i=0i<document.scripts.lengthi++)

{

if(document.scripts[i].src.indexOf('js/sk.js?')!='-1')

{

mypath=document.scripts[i].src

mypaths=mypath.split('?')

mypath=mypaths[1]

break

}

}

function WriteQqStr()

{

调用QQ的代码

}

function close_float_right(){backi.style.visibility='hidden'}

lastScrollY=0

function heartBeat(){

diffY=document.documentElement.scrollTop

percent=.1*(diffY-lastScrollY)

if(percent>0)percent=Math.ceil(percent)

else percent=Math.floor(percent)

document.all.backi.style.pixelTop+=percent

lastScrollY=lastScrollY+percent

}

if (!document.layers) {WriteQqStr()window.setInterval("heartBeat()",1)}

//-->

------------------------------------------------------------------------

厘米工厂 http://www.limitory.com/

欢迎喜欢 Drupal 的站长一起交流!

本文实例讲述了jQuery实现的网页左侧在线客服效果代码。分享给大家供大家参考,具体如下:

这是又一个网页上的在线客服代码,不错,可以用一下哦。与其它客服不一样的地方呢?无非是在网页左侧滑出,可对客服类型分组,又多了一个功能,哈哈。

运行效果截图如下:

在线演示地址如下:

http://demo.jb51.net/js/2015/jquery-left-online-kf-demo/

具体代码如下:

<!DOCTYPE

html

PUBLIC

"-//W3C//DTD

XHTML

1.0

Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html

xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>网页左侧浮动jquery在线QQ客服代码</title>

<style>

*{margin:0pxpadding:0pxoutline:nonelist-style-type:noneborder:none}

/*

QQbox

*/

.QQbox{z-index:1000width:410pxleft:-276pxtop:0margin:149px

0

0

0position:fixed}

*html,

*html

body{background-image:url(about:blank)background-attachment:fixed}

*html

.QQbox{position:absolute

top:expression(eval(document.documentElement.scrollTop))}

.QQbox

.press{left:0border:nonecursor:pointerwidth:32pxheight:96pxposition:absolutepadding-top:140px}

.QQbox

.Qlist{float:leftwidth:410pxbackground:url(images/bj01.png)

no-repeatbackground-position:1px

0pxheight:436pxdisplay:blockoverflow:hiddenzoom:1}

.QQbox

.Qlist

.infobox{text-align:centerbackground-repeat:no-repeatpadding:5pxline-height:14pxcolor:#CCCCCCfont-weight:700}

.QQbox

.Qlist

.con{margin-top:266pxmargin-left:50pxcolor:#32567efont-size:14px}

.QQbox

.Qlist

.con

ul

li{height:31pxlist-style:nonemargin-left:35px}

.QQbox

.Qlist

.con

ul

li

a{font-size:13pxmargin-left:18pxtext-decoration:none}

.OnlineLeft{float:leftdisplay:inlinewidth:262pxheight:439pxoverflow:hiddenzoom:1}

.OnlineBtn{float:rightdisplay:inlinewidth:127pxheight:36pxbackground:url(images/bj02.png)

no-repeatmargin-top:-45pxmargin-left:220px}

</style>

<script

type="text/javascript"

src="jquery-1.6.2.min.js"></script>

</head>

<body>

<div

id="divQQbox"

class="QQbox">

<div

id="divOnline"

class="Qlist">

<div

class="OnlineLeft">

<div

class="con">

<ul>

<li>售前咨询<a

target="_blank"

href="tencent://message/?uin=12345678&&Site=www.cdn.net&&Menu=yes"><img

border="0"

src="http://wpa.qq.com/pa?p=1:12345678:42"></a></li>

<li>网站建设<a

target="_blank"

href="tencent://message/?uin=12345678&&Site=www.cdn.net&&Menu=yes"><img

border="0"

src="http://wpa.qq.com/pa?p=1:12345678:42"></a></li>

<li>网站优化<a

target="_blank"

href="tencent://message/?uin=12345678&&Site=www.cdn.net&&Menu=yes"><img

border="0"

src="http://wpa.qq.com/pa?p=1:12345678:42"></a></li>

<li>整合营销<a

target="_blank"

href="tencent://message/?uin=12345678&&Site=www.cdn.net&&Menu=yes"><img

border="0"

src="http://wpa.qq.com/pa?p=1:12345678:42"></a></li>

<li>售后服务<a

target="_blank"

href="tencent://message/?uin=12345678&&Site=www.cdn.net&&Menu=yes"><img

border="0"

src="http://wpa.qq.com/pa?p=1:12345678:42"></a></li>

</ul>

</div>

</div>

<div

class="OnlineBtn">

</div>

</div>

</div>

<script

type="text/javascript">

$(function(){

//建站热线展开效果

$("#divQQbox").hover(

function(){

$(this).stop(true,false)

$(this).animate({left:0},300)

},

function(){

$(this).animate({left:-276},149)

}

)

})

</script>

</body>

</html>

希望本文所述对大家jQuery程序设计有所帮助。

<script>

function scrolls(){

var advobj=document.getElementById("adv")

advobj.style.top=100+document.documentElement.scrollTop+"px"

}

window.onscroll=scrolls

function winclose(){

var advobj=document.getElementById("adv")

advobj.style.display="none"

}

</script>

<body>

<!--随滚动条移动的浮动窗口############################-->

<div id="adv" style="">

<img src="图片路径"/>

<div id="close" onclick="winclose()">关闭</div>

</div>

<div id="header"><iframe src="header.html" height="155px" width="960px" frameborder="0"scrolling="no"></iframe></div>

</body>