h5banner

功能描述

banner轮播图

依赖的模块

快速使用

  1. 1.引用js和css文件
  3. 2.创建轮播div
  4. <div id="box"></div>
  6. 3.设置轮播资源图片
  7. var imagesAndUrl = [{
  8.   imgSrc : './img/1.jpg',
  9.   linkHref : "#"
  10. },{
  11.   imgSrc : './img/2.jpg',
  12.   linkHref : '1'
  13. },{
  14.   imgSrc : './img/3.jpg',
  15.   linkHref : '#'
  16. },{
  17.   imgSrc : './img/4.jpg',
  18.   linkHref : '#'
  19. },{
  20.   imgSrc : './img/5.jpg',
  21.   linkHref : '#'
  22. }];
  23. 4.绑定div和资源
  24. var banner = new Banner(box,imagesAndUrl,{
  25.   transitionTime : 800, // 动画过渡时间，默认为800ms
  26.   intervalTime : 5000 // 图片切换时间，默认为5s
  27. });
  30. 5.使用例子
  31. var box = document.getElementById('box');
  32. var imagesAndUrl = [{
  33.   imgSrc : './img/1.jpg',
  34.   linkHref : "#"
  35. },{
  36.   imgSrc : './img/2.jpg',
  37.   linkHref : '1'
  38. },{
  39.   imgSrc : './img/3.jpg',
  40.   linkHref : '#'
  41. },{
  42.   imgSrc : './img/4.jpg',
  43.   linkHref : '#'
  44. },{
  45.   imgSrc : './img/5.jpg',
  46.   linkHref : '#'
  47. }];
  48. var banner = new Banner(box,imagesAndUrl,{
  49.   transitionTime : 800, // 动画过渡时间，默认为800ms
  50.   intervalTime : 5000 // 图片切换时间，默认为5s
  51. });

特别说明