.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