.product07 {
width:500px;
margin:0 auto;
position:relative;
}
.product07_conn {
height:380px;
position:relative;
overflow:hidden;
padding:20px 0;
}
.product07_conn ul {
width:9999px;
height:380px;
position:absolute;
left:0;
top:0px;
}
.product07_conn ul li {
width:360px;
height:360px;
padding:10px;
margin-right:30px;
float:left;
background-color:#f5f5f5;
-webkit-transition:.3s all;
transition:.3s all;
}
.product07_conn ul li i {
width:100%;
display:block;
overflow:hidden;
height:240px;
}
.product07_conn ul li i img {
display:block;
width:100%;
height:100%;
-webkit-transition:.3s all;
transition:.3s all;
}
.product07_conn ul li p {
font-size:18px;
line-height:18px;
padding:20px 0 15px;
border-bottom:#fff 1px solid;
margin-bottom:20px;
-webkit-transition:.3s all;
transition:.3s all;
}
.product07_conn ul li span {
display:block;
font-size:14px;
color:#666;
line-height:22px;
-webkit-transition:.3s all;
transition:.3s all;
}
.product07 > span {
display:block;
position:absolute;
top:50%;
border-radius:50%;
width:80px;
line-height:80px;
background:#000;
font-size:40px;
color:#fff;
font-family:'宋体';
text-align:center;
opacity:.1;
margin-top:-40px;
cursor:pointer;
-webkit-transition:.3s all;
transition:.3s all;
}
#product07_left {
left:-120px;
}
#product07_right {
right:-120px;
}
.product07_conn ul li:hover {
background:#d80129;
box-shadow:0 0 20px rgba(0,0,0,.4)
}
.product07_conn ul li:hover img {
transform:scale(1.1);
-webkit-transform:scale(1.1);
}
.product07_conn ul li:hover p,.product07_conn ul li:hover span {
color:#fff;
}
.product07 > span:hover {
opacity:.4;
}
更新时间:2021-09-18 10:09:25
* mian: $ele, 定位元素 * boxs: $ele, 移动元素 * leftclick: $ele, 左点击 * rightclick: $ele, 右点击 timer: true 是否启用定时器, true or false 默认:false direction: "left", 移动方向:left or top 默认:“left” shownum: 2, 显示个数 默认:4 rolltime: 800, 移动时间 默认:800 restime: 3000 停留时间 默认:3000