如何使用JQ方法来完成一个轮播图的淡入淡出效果

大家好，我是程序员小辉辉，今天我正式加入CSDN这个大家庭了，希望我的知识会对你的成长起到帮助

好的！首先介绍一下今天所要讲授的知识，轮播图，是每个网站基本上都有的元素，那如何能完成一个好看的轮播图那，今天就来教大家一下！

首先，这个是html代码，这个地方很简单，不做过多的解释，简单有点编程基础的就能看懂

下面这个是css样式，同样也不做过多的解释，就是一些简单的基本样式，但是其中的定位是比较多的，建议多看看用在了那些元素上

我们来着重看一下js的代码，首先我们是用JQ的方法来书写的，所以用之前先要把jq的封装函数引进来！
首先，我们需要先在页面加载完成之后来实现这个轮播效果，然后先把ol里面的li标签和ul里的li标签获取到，然后给ul里面的li添加点击事件，这个地方个人建议使用事件委托来做，防止后期维护时新加入的图片没有轮播这个效果，
然后，前面的地方所书写的都在图片上都有注释是声明这个是做什么的，
着重讲解一下这个函数，在每一次切换之前先将上一次的图片的透明度变成0，然后站到图片所对应的li标签的下标添加动画，然后将所对应的图片的透明度变成1，这个地方是需要判断一下，就是在所有图片的都循环一遍之后，让它再从第一张图片开始，就能一直轮播，
然后，下面就很简单了，就是启动定时器，让图片每过4秒轮播一次，然后给添加移入移出事件，当鼠标移动上去的时候，就让轮播结束，移出时，又自动开始！
如果，想动态加载，就直接用ajax来书写就好了！

如此简单的轮播，小伙伴你们get到了吗！