从来没有直视过的旋转木马
时间：2023-04-05 16:41:43
HTML5
一直在做项目，遇到轮播图。我总是去网站上寻找现成的插件来使用。现成的插件1节省时间，改变尺寸和参数就可以直接使用。2、现在的插件真的很方便很强大，对于我这个刚学前端的人来说，看懂高手写的轮播图都需要费一番功夫，更何况是在工作中写的。写完之后，整个项目都会因为我而耽误。..我没有做过很多项目。最常用的是bootstrap中的carousel。它具有最基本的功能，非常适合我的第一个项目。最近无意中发现了一个比较好用的轮播。插件（Swiper）在手机上有点意思。它可以用手指触摸和拖动，也可以用两根手指放大和缩小。可以私信我^-^)。好吧，让我们谈谈业务。接触过前端的应该都知道轮播。可以说是初学必知。其实我心里想，要是他真的让我拿出电脑写一个，我就真的上当了。我今天下午有时间。我根据我多次使用的图像自己写了一个。这真的是最基本的。旋转木马。开始想写那种无缝轮播，于是写了123
外滑块{width:500px;height:400px;position:relative;overflow:hidden;},.main{float:left;width:1500px;position:absolute;left:0;top:0;transition:alllinear.5s}//一张图片是500px宽；.mian>li{浮动：左；}像这样：然后改变.main的左边；我一开始也是这么想的，我也是这样做的，轮子也可以旋转，但是怎么在轮播图上做索引，点击跳转到对应的图片，想了半天放弃了，（以后会解决）还有一种轮播，大家可能已经想到了那种改变图片透明度的轮播，我觉得好写，也可以达到同样的效果，所以……编码吧！主css.main>li{position:absolute;顶部：0；左：0；不透明度：0；transition:alllinear.5s;}//三个堆叠在一起.main.active{opacity:1;}.index.active{width:12px;高度：12px；边界半径：12px；背景色：红色；}这段重用性差，处理效率低的代码我写了半天，虽然效率低，但还好，下次说我会，我会比以前更有信心
