Html
    Css
    Js

    
                        
.sideBar {
	position:fixed;
	right:-182px;
	top:50px;
	background-color:#ffffff;
	border:#eea236 solid 1px;
	transition:right 0.5s;
	border:solid 1px red;
}
.sideBar:hover {
	right:0;
}
.sideBar>div {
	position:relative;
}
.sideBar .tips {
	position:absolute;
	height:120px;
	line-height:25px;
	background-color:#eea236;
	width:40px;
	left:-40px;
	top:50px;
	text-align:center;
	box-sizing:border-box;
	padding:10px 10px;
	border-top-left-radius:5px;
	border-bottom-left-radius:5px;
	font-weight:bold;
	color:#ffffff;
}
.sideBar .list {
	padding:0;
	list-style:none;
	width:180px;
	margin:0;
}
.sideBar .list>li {
	padding:15px;
	border-top:#eea236 dashed 1px;
}
.sideBar .list>li:hover {
	background-color:#f0ad4e;
	color:#ffffff;
}
.sideBar .list>li:first-child {
	border-top:none;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

纯css悬浮在线qq客服

2
      aaa6660
      2020/5/9 14:34:25
      假装已懂[峰]0
      2019/9/9 11:00:22