JQuery插件——backstretch

如果想要在网站的门户或是某个页面加入一个图片轮播的功能，Jquery的backstretch插件应该是个不错的选择，该插件使用配置都相当简单。

1. 第一步要在index.html中引入jquery.js和jquery.backstretch.js；
   <script src="jquery.js"></script>
<script src="jquery.backstretch.js"></script>

2. 第二步获取需要添加轮播组件div的id (class也是可以哦)。
   <div id="myId"></div>

3. 然后在对应的js控制代码中，获取该dom元素，将想要展示的图片放入backstretch中，并对duration（持续显示时间ms）和fade（渐变间隔时间ms）进行配置。
   $('#Id').backstretch([
"../assets/img/login/img1.jpg",
"../assets/img/login/img2.jpg",
"../assets/img/login/img3.jpg",
"../assets/img/login/img4.jpg",
"../assets/img/login/img5.jpg",
], {
fade: 1000,
duration: 8000
}
);

4. 现在刷新页面就可以看到了图片轮播的效果了。