如何利用css+jQuery实现简易的图片轮播效果

炫酷的图片轮播效果如何实现的呢？

首先你要有一些必备的知识点，如： css、html、javascript

废话不多说直接开干：

• 事先将你要轮播的图片准备好
• 创建三个文件夹，分别是;css 、html、 images

1. 如下是整体结构图片：
   
2. images内部是如下所示:
   
3. css内部结构如下：
   
4. html内部的结构是：
   
   核心重点来了，完整的代码给大家呈
   html代码部分:

   

     

     
     
古寨村
     
     

     
     
雪白山
     
     

     
夕阳美
     
  
  
    
   
   
    
   

css代码部分：

@charset "utf-8";
/* CSS Document */
#k{
	width:1000px;
	height:320px;
	padding:0px;
	position:relative;
	margin:0 auto;
}

ul{
	list-style:none;
	position:relative
}

li{
	position: absolute;
	top: 0px;
	left: 0px;
	float: left;
    text-align: center;
}


li img{
	width:1000px;
	height:320px;
}

.hide{
	display:none;
}

p{
	position:absolute;
	top:75%;
	left:0%;
	width:100%;
	background-color: rgb(255,255,255,0.8);
	padding:10px;
	font-family:"楷体";
}


button{
	position:absolute;
	margin:10px;
	border:none;
	outline:none;
	background-color:transparent;
	width:50px;
	height:30px;
}

#btn1{
	top:55%;
	left:0%;
}

#btn2{
	top:55%;
	left:90%;
}

现在就可以去运行html文件了，开不开心呢，若是遇到有些不懂的函数，直接找百度哈，到此分享结束啦啦啦

分享即是热爱，我是逆风，喜欢就转发出去吧。