Html
    Css
    Js

    
                        
* {
	box-sizing:border-box;
}
body {
	background-color:#333333;
}
.pic {
	height:600px;
	width:1920px;
	border:red 1px solid;
	overflow:hidden;
	position:relative;
}
.carousel {
	/* width:100%;
	*/
            list-style:none;
	padding:0;
	height:100%;
	margin:0;
	display:flex;
	flex-wrap:nowrap;
	position:absolute;
	left:0;
	top:0;
}
li {
	width:480px;
	height:100%;
}
img {
	width:480px !important;
	height:100%;
}
.leftArrow,.rightArrow {
	width:20px;
	height:20px;
	border:hotpink 1px solid;
	border-radius:50%;
}
.leftArrow {
	position:absolute;
	top:50%;
	transform:translateY(-100%);
	right:20px;
}
.rightArrow {
	position:absolute;
	top:50%;
	transform:translateY(-100%);
	left:20px;
}

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

jquery多图轮播图

更新时间:2021-12-07 01:14:53

0