
简介:该插件由本人开发制作,并取名Rotation,面向全网免费使用,是一款轻量化的首页轮播图插件,下面我们来看看该如何使用吧~
插件可直接在线引用,也可下载下来本地化(推荐在线引用,可保持更新
引用地址:https://assets.huoyinetwork.cn/Frish/JS/Rotation.js
<script src="https://assets.huoyinetwork.cn/Frish/JS/Rotation.js"></script>
使用方法
写html代码
<div class="latest-re-cp"> ---大容器 <div class="latest-rq"> ---小容器 <ul> 1 </ul> <ul> 2 </ul> <ul> 3 </ul> </div> <ul class="latest-an"> ---放小圆点的容器 要几个小圆点就放几个<li> <li></li> <li></li> <li></li> </ul> </div> 左右按钮,可以自己定义,名字要和js的名字对应 <button class="latest-re-left">左移</button> <button class="latest-re-right">右移</button>
首先在html中引入jQuery框架,一定要比我的框架先引用!!!
直接引用网上的代码
或者下载源代码
html引入Rotation.js
写一个css代码
/* 给外边大容器一个宽高 */ .latest-re-cp{ width:500px; height:300px; }
自己新建一个js文件,例如index.js,并把它引入到html中,顺序一定不要搞错!!!
引入顺序:jquery>Rotation.js>自己的js文件
在自己的js中写:
Rotation({ //外边大容器 class名字前面记得加 "." ,id加"#" !!!!!!!! max_content: ".latest-re-cp", // 小容器 content: ".latest-rq", // 轮播的间隔时间 speed: 4000, // 左边按钮 left: ".latest-re-left", // 右边按钮 right: ".latest-re-right", // 是否显示小圆点 isdoc: true, // 装小圆点的容器 dot: ".latest-an", // 小圆点选中的颜色 doc_color: "#DB6400" });
wow,作者牛逼
??对,挺牛,牛得你自己跑评论区来搞事情了
嗯哼