Html
    Css
    Js

    
                        
 .show {
	width:1100px;
	height:500px;
	margin:0 auto;
	overflow:hidden;
}
.show div {
	width:200px;
	height:500px;
	float:left;
}
.show div:nth-of-type(1) {
	background:url(http://www.jq22.com/img/cs/500x500-1.png);
	background-size:500px 500px;
}
.show div:nth-of-type(2) {
	background:url(http://www.jq22.com/img/cs/500x500-2.png);
	background-size:500px 500px;
}
.show div:nth-of-type(3) {
	background:url(http://www.jq22.com/img/cs/500x500-3.png);
	background-size:500px 500px;
}
.show div:nth-of-type(4) {
	background:url(http://www.jq22.com/img/cs/500x500-4.png);
	background-size:500px 500px;
}
.show div:nth-of-type(5) {
	background:url(http://www.jq22.com/img/cs/500x500-5.png);
	background-size:500px 500px;
}

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

手风琴图片效果

如有bug,请见谅。新手上路,望指教。

0