最近我的主页上的幻灯因为Flash Player的问题总是不能正常显示,于是就上网找到了这个轮播图插件,之前也用过其他的但是都不太好用或者说修改起来很麻烦不能很好的嵌入到自己的网页中,今天说的这个就很好用了,记录一下,方便以后用的时候查看。
01.准备工作
首先我们需要的就是该插件的js文件,该插件真的是轻量级插件,js文件只有10k,但是下载的话可能需要绕弯子,待会我会把所有用到的文件打包分享一下。
然后就是你需要的风格对应的风格文件了,每种风格对应了一个js文件和一个css文件,同样的我会把所有的风格文件分享出来。
02.开始使用
首先导入上面所述的文件,这里我选择的是mF_kdui风格,更多风格可以在文末给出的地址预览:
<script type="text/javascript" src="js/myfocus-2.0.0.min.js"></script><!--引入myFocus库-->
<script type="text/javascript" src="js/mf-pattern/mF_kdui.js"></script><!--引入风格js文件-->
<link href="js/mf-pattern/mF_kdui.css" type="text/css" /><!--引入风格css文件-->
然后我们需要创建myFocus标准的html结构,并填充你的内容,这个直接复制就行了: