javascript 固定在網頁右側的可顯隱網站QQ客服

來源:互聯網
上載者:User
提示:您可以先修改部分代碼再運行

<!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>固定在網頁右側的可顯隱網站客服</title><meta http-equiv="content-type" content="text/html;charset=gb2312"><!--把下面代碼加到<head>與</head>之間--><style type="text/css">body,a{font-size:12px;color:#000000;}a{text-decoration:none;color:#000000;}ul{margin-left:5px;}li{list-style:none;}.qqbox{z-index:99;width:170px;right:3px;top:145px;position:absolute;}.qqbox .press{right:0;border:none;cursor:pointer;width:26px;height:136px;position:absolute;}.qqbox .qlist{left:0;width:170px;background:url(http://www.111cn.net/effect/images/201007040830/siderim_bg.gif) padding:5px;}.qqbox .qlist .b{float:right;height:6px;width:170px;font-size:1px;}.qqbox .qlist .infobox{text-align:center;background:#bdc5cb;background-image:url(http://www.111cn.net/effect/images/201007040830/siderim_infobox.gif);background-repeat:no-repeat;padding:5px;line-height:14px;color:#000;font-weight:700;}.qqbox .qlist .t{background:url(http://www.111cn.net/effect/images/201007040830/siderim_title.gif);height:34px;}.qqbox .qlist .b{background:url(http://www.111cn.net/effect/images/201007040830/siderim_bottom.gif);height:9px;overflow:hidden;}.qqbox .qlist .con{background:url(http://www.111cn.net/effect/images/201007040830/siderim_bg.gif);width:100%;padding:10px 0px 10px 0px;}.qqbox .qlist .con h2{height:22px;font:bold 12px/22px "宋體";background:url(http://www.111cn.net/effect/images/201007040830/siderim_bg.gif) repeat-y -163px 0;border:1px solid #3a708d;text-align:center;color:#fff;}.qqbox .qlist .con ul li{padding:5px 5px 0px 15px;}</style></head><body><div ></div><!--把下面代碼加到<body>與</body>之間--><div class="qqbox" id="divqqbox"><div class="qlist" id="divonline" onmouseout="hidemsgbox(event);" ><div class="t"></div><div class="infobox">我們營業的時間<br>9:00-18:00</div><div class="con"><ul><li>qq諮詢</li><li>msn諮詢</li><li>線上WangWang</li><li>諮詢電話:010-88888888</li></ul></div><div class="b"></div></div><div id="divmenu" onmouseover="onlineover();"></div></div><script language="javascript" type="text/javascript">//<![cdata[var tips; var thetop = 145/*這是預設高度,越大越往下*/;var old = thetop;function initfloattips() {tips = document.getelementbyid("divqqbox");movetips();};function movetips() {var tt=50;if (window.innerheight) {pos = window.pageyoffset}else if (document.documentelement && document.documentelement.scrolltop) {pos = document.documentelement.scrolltop}else if (document.body) {pos = document.body.scrolltop;}pos=pos-tips.offsettop+thetop;pos=tips.offsettop+pos/10;if (pos < thetop) pos = thetop;if (pos != old) {tips.style.top = pos+"px";tt=10;//alert(tips.style.top);}old = pos;settimeout(movetips,tt);}//!]]>initfloattips();function onlineover(){document.getelementbyid("divmenu").style.display = "none";document.getelementbyid("divonline").style.display = "block";document.getelementbyid("divqqbox").style.width = "145px";}function onlineout(){document.getelementbyid("divmenu").style.display = "block";document.getelementbyid("divonline").style.display = "none";}if(typeof(htmlelement)!="undefined") //給firefox定義contains()方法,ie下不起作用{ htmlelement.prototype.contains=function(obj) { while(obj!=null&&typeof(obj.tagname)!="undefind"){ //通過迴圈對比來判斷是不是obj的父元素     if(obj==this) return true;     obj=obj.parentnode;   } return false; }; } function hidemsgbox(theevent){ //theevent用來傳入事件,firefox的方式  if (theevent){  var browser=navigator.useragent; //取得瀏覽器屬性  if (browser.indexof("firefox")>0){ //如果是firefox   if (document.getelementbyid("divonline").contains(theevent.relatedtarget)) { //如果是子項目   return; //結束函式} } if (browser.indexof("msie")>0){ //如果是ieif (document.getelementbyid("divonline").contains(event.toelement)) { //如果是子項目return; //結束函式}}}/*要執行的操作*/document.getelementbyid("divmenu").style.display = "block";document.getelementbyid("divonline").style.display = "none";}</script></body></html>
提示:您可以先修改部分代碼再運行

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.