7_微商城slide图片制作
一、学习目标：
1、能够制作slide图片
2、学会使用swiper插件:http://www.swiper.com.cn/api/index.html
二、制作步骤详解：
复制html模板:见http://www.swiper.com.cn/usage/swiper4/index.html
↓引入swiper插件：
① css文件（勿忘）
<link rel="stylesheet" href="path/to/swiper.min.css">
② js文件--通过requirejs，见mainconfig.js↓：
<script src="script/libs/require.js" data-main="script/views/enterjs/mainconfig"></script>
↓创建入口文件：static>script>views>enterjs>mainconfig.js
↓配置mainconfig.js:
require.config({
paths:{
jquery:"../../libs/jquery", //swiper基于jquery
swiper:"../../plugs/swiper.min"
}
})
require(['jquery','swiper'],function(){
var topSlider=new Swiper('#topSlider', {
slidesPerView: 1,
//centeredSlides: true,
autoplay: 3000,
loop: true,
autoplayDisableOnInteraction: true
});
})
slider-效果图.gif
