js浮动客服代码演示地址大全,js浮动客服代码演示地址大全下载

本文目录一览：

1、这是一段在线客服JS代码它是右边浮动的如何改让它左浮动？
2、求一个能用的右侧浮动JS代码
3、浮动窗口的代码（html/js）
4、jQuery实现的网页左侧在线客服效果代码
5、JS网页中的浮动窗口代码？
6、js在线客服代码

这是一段在线客服JS代码它是右边浮动的如何改让它左浮动？

代码中没有出现left 及 width，可能在线客服的css style决定了它的竖直位置，请看看 divQQbox

等一些div的样式。

求一个能用的右侧浮动JS代码

请将代码放置在head/head之间即可

script language=”javascript”

suspendcode=”DIV id=lovexin style=’Z-INDEX: 10; LEFT: 850px; POSITION: absolute; TOP: 140px; width: 88px; height: 203px;’a href=”img src=’../20080128/er_p.jpg’ width=’150′ height=’200′ border=’0’/a/DIV”

document.write(suspendcode);

lastScrollY=0;

function heartBeat(){

diffY=document.body.scrollTop;

percent=.1*(diffY-lastScrollY);

if(percent0)percent=Math.ceil(percent);

else percent=Math.floor(percent);

document.all.lovexin.style.pixelTop+=percent;

lastScrollY=lastScrollY+percent;

}

window.setInterval(“heartBeat()”,1);

/script

代码说明：

1、加到左侧的时候,把left属性改为10就好；

2、TOP是控制这个浮动广告离上边的距离，可以根据自己的实际情况进行调整；

3、这里href=’和这里img src=’../20080128/er_p.jpg’ 换成你想要的浮动广告的图片。其中这句src=../20080128/er_p.jpg’ width=’150′ height=’200’border=’0′ 中WIDTH=‘150’ height=’200’是你浮动广告图片的宽和高。

浮动窗口的代码（html/js）

第一种方法:

Html代码

html

head

title浮动窗口/title

link type=”text/css” rel=”stylesheet” href=”css/overflow.css” /

script type=”text/javascript” src=”js/jquery.js”/script

script type=”text/javascript” src=”js/overflow.js”/script

script type=”text/javascript”

$(document).ready(function(){

var b = $(“#b”);

var overFlow = $(“#over”);

b.click(function(){

overFlow.fadeIn();

$(“#mask”).css(“background”,”#111″);

$(“#mask”).css(“opacity”,”0.8″);

})

$(“#close”).click(function(){

overFlow.fadeOut();

$(“#mask”).css(“background”,”#fff”);

$(“#mask”).css(“opacity”,”1″);

});

drag($(“#over”),$(“#title”));

}) ;

/script

/head

body

div id=”over”

div id=”title”span id=”t”这只是一个演示标题/spanspan id=”close”[ x ]/span/div

div id=”content”

When a container object, such as a div, has mouse capture, events originating on objects within that container are fired by the div, unless the bContainerCapture parameter of the setCapture method is set to false. Passing the value false causes the container to no longer capture all document events. Instead, objects within that container still fire events, and those events also bubble as expected.br/

—This is edited by Alp.

/div

div id=”mask” a id=”b” href=”#”click/a/div

/body

/html

Js代码

function drag(overFlow,title){

title.onmousedown = function(evt){

var doc = document;

var evt = evt || window.event;

var x = evt.offsetX?evt.offsetX:evt.layerX;

var y = evt.offsetY?evt.offsetY:evt.layerY;

if(overFlow.setCapture){

overFlow.setCapture();

}else if(window.captureEvents){

window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);

}

doc.onmousemove = function(evt){

evt = evt || window.event;

var xPosition = evt.pageX || evt.clientX;

var yPosition = evt.pageY || evt.clientY;

var newX = xPosition – x;

var newY = yPosition – y;

overFlow.style.left = newX;

overFlow.style.top = newY;

};

doc.onmouseup = function(){

if(overFlow.releaseCapture){

overFlow.releaseCapture();

}else if(window.captureEvents){

window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);

}

doc.onmousemove=null;

doc.onmouseup=null;

};

}

css代码

#over{

position: absolute;

left: 300px;

top: 200px;

border: 1px solid black;

display: none;

background: #cccccc;

cursor: default;

width: 300px;

z-index: 10;

opacity: 1;

}

#title{

border: 1px solid #1840C4;

background: #95B4DC;

padding: 2px;

font-size:12px;

cursor: default;

}

#close{

cursor: pointer;

margin-right: 1px;

overflow: hidden;

}

#content{

border: 1px solid #C2D560;

background: #EFF4D7;

}

#t{

margin-right:145px;

}

#mask{

z-index: 1;

background: #fff;

width: 1024px;

height: 800px;

}

#b{

position: absolute;

left: 200px;

top: 100px;

}

body{

padding: 0px;

margin: 0px;

}

#over{

background: transparent;

}

第二种方法:

消息框遮罩层:iframe id=”show_upload_iframe” frameborder=0 scrolling=”no” style=”display:none; position:absolute;”/iframediv id=”show_upload”nothing…/div’

页面加载loading中:div id=”body_loading” onClick=”loaded();”img src=”__PUBLIC__/images/body_load.gif”/div

关闭浮动窗口:a href=”javascript:hideupload()”关闭窗口建议用小图片/a

打开浮动窗口:a href=”javascript:showupload(‘admin.php’)”打开浮动/a

// 消息框loading

function loading(){

var o = $(‘#body_loading’);

o.css(“left”,(($(document).width())/2-(parseInt(o.width())/2))+”px”);

o.css(“top”,(($(document).height()+$(document).scrollTop())/2-(parseInt(o.height())/2))+”px”);

o.fadeIn(“fast”);

}

// 消息框消失

function loaded(){

var o = $(‘#body_loading’);

o.fadeOut(“fast”);

}

// 隐藏浮动窗口

function hideupload(){

$(‘#show_upload’).hide();

$(‘#show_upload_iframe’).hide();

}

// 弹出浮动窗口

function showupload(ajaxurl){

loading();

var o=$(‘#show_upload’);

var f=$(‘#show_upload_iframe’);

var top = 200;

$.ajax({

url: ajaxurl,

//cache: false,

success: function(res){

loaded();

o.html(res);

o.css(“left”,(($(document).width())/2-(parseInt(o.width())/2))+”px”);

if($(document).scrollTop()200){

top = ($(document).height()+$(document).scrollTop())/2-(parseInt(o.height())/2);

}

o.css(“top”,top+”px”);

f.css({‘width’:o.width(),’height’:o.height(),’left’:o.css(‘left’),’top’:o.css(‘top’)});

f.show();

o.show();

}

});

}

jQuery实现的网页左侧在线客服效果代码

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

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

运行效果截图如下：

在线演示地址如下：

具体代码如下：

!DOCTYPE

html

PUBLIC

“-//W3C//DTD

XHTML

1.0

Transitional//EN”

“”

html

xmlns=””

head

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

style

*{margin:0px;padding:0px;outline:none;list-style-type:none;border:none;}

QQbox

.QQbox{z-index:1000;width:410px;left:-276px;top:0;margin:149px

0;position: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:0;border:none;cursor:pointer;width:32px;height:96px;position:absolute;padding-top:140px;}

.QQbox

.Qlist{float:left;width:410px;background:url(images/bj01.png)

no-repeat;background-position:1px

0px;height:436px;display:block;overflow:hidden;zoom:1;}

.QQbox

.Qlist

.infobox{text-align:center;background-repeat:no-repeat;padding:5px;line-height:14px;color:#CCCCCC;font-weight:700;}

.QQbox

.Qlist

.con{margin-top:266px;margin-left:50px;color:#32567e;font-size:14px;}

.QQbox

.Qlist

.con

li{height:31px;list-style:none;margin-left:35px;}

.QQbox

.Qlist

.con

a{font-size:13px;margin-left:18px;text-decoration:none;}

.OnlineLeft{float:left;display:inline;width:262px;height:439px;overflow:hidden;zoom:1;}

.OnlineBtn{float:right;display:inline;width:127px;height:36px;background:url(images/bj02.png)

no-repeat;margin-top:-45px;margin-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”

li售前咨询a

target=”_blank”