“幻灯片”,slide,传统js+html 制作幻灯片,三屏轮播系统.example:
selection:slideshow()
<style>
/*slideShow幻灯片*/
.mySlides {display:none;}
/* 幻灯片容器 */
.slideshow-container {
max-width: 1000px;
position: relative;
margin: auto;
}
/* 下一张 & 上一张 按钮 */
.prev, .next {
cursor: pointer;
position: absolute;
top: 40%;
width: auto;
padding: 16px;
color: white;
font-weight: bold;
font-size: 18px;
transition:3s ease;/*次过渡属性结合rgba()函数使用背景色过渡变换效果*/
border-radius: 50%;
}
/* 定位 "下一张" 按钮靠右 */
.next {
right: 0px;
border-radius: 3px 0 0 3px;
}
/* 当鼠标悬停时修改背景色*/
.prev:hover, .next:hover {
background-color: rgba(177,0,0,0.8);