• JS+CSS实现出现在网页左侧可折叠在线客户代码


    代码内容:

    <!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>JS+CSS实现出现在网页左侧可折叠在线客户代码_网页代码站(www.webdm.cn)</title>
    <style type=text/css>
    body{margin:0px}
    
    .main_head {
    	BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_2.png) no-repeat
    }
    * HTML .main_head {
    	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.webdm.cn/images/20100921/img3-5_2.png",sizingMethod='crop'); BACKGROUND: none 
    
    transparent scroll repeat 0% 0%
    }
    * + HTML .main_head {
    	BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_2.png) no-repeat
    }
    .info {
    	PADDING-BOTTOM: 10px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_3.png) repeat-y; PADDING-TOP: 5px
    }
    * HTML .info {
    	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.webdm.cn/images/20100921/img3-5_3.png",sizingMethod='crop'); BACKGROUND-REPEAT: repeat-y
    }
    * + HTML .info {
    	PADDING-BOTTOM: 10px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_3.png) repeat-y; PADDING-TOP: 5px
    }
    .down_kefu {
    	WIDTH: 157px; BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_4.png) no-repeat; HEIGHT: 8px
    }
    * HTML .down_kefu {
    	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.webdm.cn/images/20100921/img3-5_4.png",sizingMethod='crop'); WIDTH: 157px; BACKGROUND-
    
    REPEAT: repeat-y; HEIGHT: 8px
    }
    * + HTML .down_kefu {
    	WIDTH: 157px; BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_4.png) no-repeat; HEIGHT: 8px
    }
    .Obtn {
    	MARGIN-TOP: 104px; WIDTH: 32px; BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_1.png) no-repeat; FLOAT: left; HEIGHT: 139px; MARGIN-LEFT: -5px
    }
    * HTML .Obtn {
    	FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.webdm.cn/images/20100921/img3-5_1.png",sizingMethod='crop'); WIDTH: 32px; BACKGROUND: 
    
    none transparent scroll repeat 0% 0%; FLOAT: left; HEIGHT: 139px
    }
    * + HTML .Obtn {
    	MARGIN-TOP: 104px; WIDTH: 32px; BACKGROUND: url(http://www.webdm.cn/images/20100921/img3-5_1.png) no-repeat; FLOAT: left; HEIGHT: 139px; MARGIN-LEFT: -5px
    }
    .qqtable SPAN {
    	PADDING-BOTTOM: 5px; LINE-HEIGHT: 20px; PADDING-LEFT: 0px; WIDTH: 100px; PADDING-RIGHT: 0px; COLOR: #ff6600; FONT-SIZE: 13px; FONT-WEIGHT: bold; PADDING-TOP: 5px
    }
    .qqtable A {
    	TEXT-DECORATION: none
    }
    .qqtable A:hover {
    	TEXT-DECORATION: none
    }
    .qun {
    	BORDER-BOTTOM: #ffd2bf 1px solid; BORDER-LEFT: #ffd2bf 1px solid; PADDING-BOTTOM: 5px; LINE-HEIGHT: 20px; BACKGROUND-COLOR: #ffffff; PADDING-LEFT: 0px; WIDTH: 
    
    100px; PADDING-RIGHT: 0px; FONT-SIZE: 12px; BORDER-TOP: #ffd2bf 1px solid; BORDER-RIGHT: #ffd2bf 1px solid; PADDING-TOP: 5px
    }
    .qun SPAN {
    	COLOR: #ff6600; FONT-SIZE: 13px; FONT-WEIGHT: bold
    }
    
    </style>
    
    </head>
    
    <body>
    <table width="980" height="2500" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#F4F4F4">
      <tr>
        <td align="center" valign="top">
    	  <p> </p>
          <p> </p>
          <p> </p>
          <p> </p>
          <p> </p>
          <p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>
          <p><p>功能:可折叠收缩,可随滚动条滚动。</p></p>
        <p></p></td>
      </tr>
    </table>
    
    <DIV id=webdm onmouseover=toBig() onmouseout=toSmall()>
    <TABLE style="FLOAT: left" border=0 cellSpacing=0 cellPadding=0 width=157>
      <TBODY>
      <TR>
        <TD class=main_head height=39 vAlign=top> </TD></TR>
      <TR>
        <TD class=info vAlign=top>
          <TABLE class=qqtable border=0 cellSpacing=0 cellPadding=0 width=120 
          align=center>
            <TBODY>
            <TR>
              <TD align=middle><a href="http://www.webdm.cn/" target="_blank"><IMG border=0 
                src="http://www.webdm.cn/images/20100921/
    kefu_head.gif"></a> </TD>
            </TR>
            <TR>
              <TD height=5></TD></TR>
            <TR>
              <TD height=30 align=middle><SPAN>QQ:187397645</SPAN></TD></TR>
            <TR>
              <TD height=30 align=middle><SPAN>QQ:187397645</SPAN></TD></TR>
            <TR>
              <TD height=5></TD></TR>
            <TR>
              <TD height=35 vAlign=top align=middle><A href="http://www.webdm.cn/" target="_blank"><IMG border=0 src="http://www.webdm.cn/images/20100921/
    img3-5-btn1.gif" width=90 height=25></A></TD>
            </TR>
            <TR>
              <TD height=38 vAlign=top align=middle><A href="http://www.webdm.cn/" target="_blank"><IMG border=0 src="http://www.webdm.cn/images/20100921/
    img3-5-btn2.gif" width=90 height=25></A></TD>
            </TR>
            <TR>
              <TD align=middle>
                <DIV class=qun><FONT 
                color=#9b9b9b>会员交流群</FONT><BR><SPAN>82040548</SPAN></DIV></TD></TR>
            <TR>
              <TD align=middle>
                <DIV class=qun><FONT 
                color=#9b9b9b>商家交流群</FONT><BR><SPAN>82040548</SPAN></DIV></TD></TR>
            <TR>
              <TD align=middle> </TD></TR></TBODY></TABLE></TD></TR>
      <TR>
        <TD class=down_kefu vAlign=top></TD></TR></TBODY></TABLE>
    <DIV class=Obtn></DIV></DIV>
    <SCRIPT language=javascript>
    		客服龙龙=function (id,_top,_left){
    		var me=id.charAt?document.getElementById(id):id, d1=document.body, d2=document.documentElement;
    		d1.style.height=d2.style.height='100%';me.style.top=_top?_top+'px':0;me.style.left=_left+"px";//[(_left>0?'left':'left')]=_left?Math.abs(_left)+'px':0;
    		me.style.position='absolute';
    		setInterval(function (){me.style.top=parseInt(me.style.top)+(Math.max(d1.scrollTop,d2.scrollTop)+_top-parseInt(me.style.top))*0.1+'px';},10+parseInt
    
    (Math.random()*20));
    		return arguments.callee;
    		};
    		window.onload=function (){
    		客服龙龙
    		('webdm', 100, -152)
    		}
    	</SCRIPT>
    
    <SCRIPT language=javascript> 
    			lastScrollY=0; 
    			
    			var InterTime = 1;
    			var maxWidth=-1;
    			var minWidth=-152;
    			var numInter = 8;
    			
    			var BigInter ;
    			var SmallInter ;
    
    			var o = document.getElementById("webdm");
    				var i = parseInt(o.style.left);
    				function Big()
    				{
    					if(parseInt(o.style.left)<maxWidth)
    					{
    						i = parseInt(o.style.left);
    						i += numInter;	
    						o.style.left=i+"px";	
    						if(i==maxWidth)
    							clearInterval(BigInter);
    					}
    				}
    				function toBig()
    				{
    					clearInterval(SmallInter);
    					clearInterval(BigInter);
    						BigInter = setInterval(Big,InterTime);
    				}
    				function Small()
    				{
    					if(parseInt(o.style.left)>minWidth)
    					{
    						i = parseInt(o.style.left);
    						i -= numInter;
    						o.style.left=i+"px";
    						
    						if(i==minWidth)
    							clearInterval(SmallInter);
    					}
    				}
    				function toSmall()
    				{
    					clearInterval(SmallInter);
    					clearInterval(BigInter);
    					SmallInter = setInterval(Small,InterTime);
    					
    				}
    				
    </SCRIPT>
    </body>
    </html>
    <br>
    <p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>
    
    代码来自:http://www.webdm.cn/webcode/9a4492d2-72f8-4f04-8d1b-2c6df0e0bd59.html
    
  • 相关阅读:
    ASP.NET实现年月日三级联动(局部刷新)
    通过ip地址获取当前地理位置
    Microsoft.Practices.Unity 给不同的对象注入不同的Logger
    sqlserver 数据库里面金额类型为什么不建议用float,实例告诉你为什么不能。
    bindingredirect 没有效果
    Expression构建DataTable to Entity 映射委托
    windows 2003 远程桌面 连接输入账号密码后,只能看见蓝色屏幕和鼠标
    vmware workstation 10.0.1 install mac os mavericks
    教师节我的专属祝福方式!
    信盈达学员学习心得
  • 原文地址:https://www.cnblogs.com/webdm/p/2095258.html
Copyright © 2020-2023  润新知