请问:我的网站是css+div布局设计的,我想在左边加一个QQ客服代码。请问怎么加?(是加列还是什么的,

html-css030

请问:我的网站是css+div布局设计的,我想在左边加一个QQ客服代码。请问怎么加?(是加列还是什么的,,第1张

<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=459049940&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:459049940:41" alt="点击这里给我发消息" title="点击这里给我发消息"></a>

以上代码放到对应位置就ok了,注意a标签以及img的css设定

这个很好用,ie6-7-8 谷歌都兼容。你看下是不是这个。图片背景的话可以发送到你邮箱

<!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>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>QQ客服</title>

<style type="text/css">

img{border:0}

ul,li{padding:0margin:0}

.QQbox {z-index:99left:0width:128pxheight:234pxposition:absolute}

.QQbox .press{left:0width:36pxcursor:pointerposition:absoluteheight:128px}

.QQbox .Qlist{left:0width:131pxposition:absoluteheight:234pxbackground:url(floatServiceBj.gif) no-repeat left center}

.QQbox .Qlist ul{padding:43px 0 0 21px}

.QQbox .Qlist li{height:26pxmargin-bottom:11px_margin-bottom:7pxlist-style-type:nonemargin-left:14px}

</style>

<script type="text/javascript">

window.onload = window.onresize = window.onscroll = function ()

{

var oBox = document.getElementById("divQQbox")

var oLine = document.getElementById("divOnline")

var oMenu = document.getElementById("divMenu")

var iScrollTop = document.documentElement.scrollTop || document.body.scrollTop

setTimeout(function ()

{

clearInterval(oBox.timer)

var iTop = parseInt((document.documentElement.clientHeight - oBox.offsetHeight)/2) + iScrollTop

oBox.timer = setInterval(function ()

{

var iSpeed = (iTop - oBox.offsetTop) /2

iSpeed = iSpeed >0 ? Math.ceil(iSpeed) : Math.floor(iSpeed)

oBox.offsetTop == iTop ? clearInterval(oBox.timer) : (oBox.style.top = oBox.offsetTop + iSpeed + "px")

}, 30)

}, 100)

oBox.onmouseover = function ()

{

this.style.width = 131 + "px"

oLine.style.display = "block"

oMenu.style.display = "none"

}

oBox.onmouseout = function ()

{

this.style.width = ''

oLine.style.display = "none"

oMenu.style.display = "block"

}

}

</script>

</head>

<body style="height:1310pxwidth:1421pxbackground:url(BG.jpg) no-repeat">

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

<!--在线客服 begin -->

<div class="QQbox" id="divQQbox" >

<div class="Qlist" id="divOnline" style="display:none">

<ul>

<a></a>

<li><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=你的QQ号码&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:你的QQ号码:41"></a></li>

<li><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=你的QQ号码&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:你的QQ号码:41"></a></li>

<li><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=你的QQ号码&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:你的QQ号码:41"></a></li>

<li><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=你的QQ号码&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:你的QQ号码:41"></a></li>

<li><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=你的QQ号码&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:你的QQ号码:41 "></a></li>

</ul>

</div>

<div id="divMenu"><img src="floatService1.gif" class="press" alt="在线客服"></div>

</div>

</body>

</html>

一般情况下都是用CSS的fixed固定定位,但不兼容IE6,在IE6下,用absolute方式。

下面给出简单的兼容写法代码实现。仅供参考:

<style>    

*{margin:0px padding:0px}    

body {height:2000px}    

div {width:100px height:100px background:#ccc position:absolute bottom:0px right:0px}    

</style>    

<script>    

window.onload=function(){    

var oDiv = document.getElementById('div1')    

if(window.navigator.userAgent.indexOf('MSIE 6') != -1)    

{    

window.onscroll = function(){    

var scrollTop = document.documentElement.scrollTop || document.body.scrollTop    

var top = document.documentElement.clientHeight - oDiv.offsetHeight + scrollTop      

oDiv.style.top = top + 'px'    

}

}    

else    

{    

oDiv.style.position='fixed'    

}    

}    

</script>