/* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; /*auto锛氶粯璁ゅ€笺€傛祻瑙堝櫒鍏佽涓€浜涙墜鍔匡紙touch锛夋搷浣滃湪璁剧疆浜嗘灞炴€х殑鍏冪礌涓婏紝渚嬪锛氬瑙嗗彛锛坴iewport锛夊钩绉汇€佺缉鏀剧瓑鎿嶄綔銆 none锛氱姝㈣Е鍙戦粯璁ょ殑鎵嬪娍鎿嶄綔銆 pan-x锛氬彲浠ュ湪鐖剁骇鍏冪礌(the nearest ancestor)鍐呰繘琛屾按骞崇Щ鍔ㄧ殑鎵嬪娍鎿嶄綔銆 pan-y锛氬彲浠ュ湪鐖剁骇鍏冪礌鍐呰繘琛屽瀭鐩寸Щ鍔ㄧ殑鎵嬪娍鎿嶄綔銆 manipulation锛氬厑璁告墜鍔挎按骞?鍨傜洿骞崇Щ鎴栨寔缁殑缂╂斁銆備换浣昦uto灞炴€ф敮鎸佺殑棰濆鎿嶄綔閮戒笉鏀寔銆?/ } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick-dots{ position: absolute; bottom: 10px; width: 100%; text-align: center; } .slick-dots li{ width: 10px; height: 10px; border-radius: 50%; background:#8453bb; transition: all .5s ease-in-out; display: inline-block; float: none; margin: 0 3px; } .slick-dots li.slick-active{ opacity:1; } .slick-dots li button{ width: 10px; height: 10px; border-radius: 50%; background: none; border: none; text-indent: -99px; overflow: hidden; opacity: .6; } .slick-prev { left: 0; -webkit-transform: scale(0) translateX(-100%); -ms-transform: scale(0) translateX(-100%); transform: scale(0) translateX(-100%); -webkit-transition: all .5s ease; transition: all .5s ease; } .slick-next { right: 0; -webkit-transition: all .5s ease; transition: all .5s ease; -webkit-transform: scale(0) translateX(100%); -ms-transform: scale(0) translateX(100%); transform: scale(0) translateX(100%); } .slick-prev, .slick-next { position: absolute; display: block; /*background: rgba(255,255,255,.7);*/ border-radius: 50%; height: 40px; width: 40px; line-height: 0; font-size: 20px; cursor: pointer; /*background: transparent;*/ color: #666; top: 50%; margin-top: -20px; padding: 0; border: none; outline: none; font-family: "SimSun"; } .slick-prev:after, .slick-next:after { top: -2px; left: -2px; padding: 2px; z-index: -1; background: rgba(255, 255, 255, 0.7); -webkit-transition: -webkit-transform 0.2s, opacity 0.2s; transition: transform 0.2s, opacity 0.2s; pointer-events: none; position: absolute; width: 100%; height: 100%; border-radius: 50%; content: ''; box-sizing: content-box; } .i-img-list:hover .slick-prev { -webkit-transform: scale(1) translateX(100%); -ms-transform: scale(1) translateX(100%); transform: scale(1) translateX(100%); } .i-img-list:hover .slick-next { -webkit-transform: scale(1) translateX(-100%); -ms-transform: scale(1) translateX(-100%); transform: scale(1) translateX(-100%); } .slick-prev:hover { box-shadow: 0 0 0 2px #fff; } .slick-prev:hover:after { background: rgba(255, 255, 255, 0.9); -webkit-transform: scale(0.85); -ms-transform: scale(0.85); transform: scale(0.85); } .slick-next:hover { box-shadow: 0 0 0 2px #fff; } .slick-next:hover:after { background: rgba(255, 255, 255, 0.9); -webkit-transform: scale(0.85); -ms-transform: scale(0.85); transform: scale(0.85); }