carousel轮播图焦点图插件特效

 所属分类:焦点图/幻灯片

 浏览:27次-  下载:0次-  评论: 0次-  更新时间:2021-10-10

carousel轮播图焦点图插件特效

使用方法非常的简单便捷,如下:

1、引入所需的css文件和js文件

<link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/carousel.css">
<script src="js/carousel.js"></script>

2、设置轮播图div容器

<div id="carousel"></div>

3、js代码显示轮播图

<script>var carousel =new Carousel({wrap:document.getElementById("carousel"),urlArr:["img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg","img/5.jpg","img/6.jpg"]
});</script>

使用还是非常方便的,并且可以在同一页面上设置不同的div属性id显示多个轮播图。

金币说明:注册即送10金币,每日签到可获得更多金币,成为VIP会员可免金币下载! 充值金币充值会员更多说明»
描述:非常不错的一款carousel轮播图焦点图插件,使用非常方便,同时也可以应用在移动端,并且可以通过不同的div在同一页面上多次使用。

文件目录结构

  • img
      • ┝ 2.jpg
      • ┝ 6.jpg
      • ┝ 5.jpg
      • ┝ 3.jpg
      • ┝ 4.jpg
      • ┝ 1.jpg
      • ┝ img-lg.jpg
  • ┝ www.zzsucai.com.txt
  • ┝ index.html
  • js
      • ┝ carousel.js
  • ┝ 站长素材网.url
  • css
      • ┝ user-index.css
      • ┝ carousel.css
  • font-awesome-4.7.0
      • fonts
          • ┝ fontawesome-webfont.woff
          • ┝ fontawesome-webfont.eot
          • ┝ fontawesome-webfont.woff2
          • ┝ fontawesome-webfont.svg
          • ┝ fontawesome-webfont.ttf
      • ┝ HELP-US-OUT.txt
      • css
          • ┝ font-awesome.css
          • ┝ font-awesome.min.css
      • scss
        • less

      讨论这个素材(0)回答他人问题或分享使用心得奖励金币

      〒_〒 居然一个评论都没有……

      表情  文明上网,理性发言!
      我的金币余额: 0 已下载次数: 0
      所需金币:15开始下载

      金币获取:签到、评论、投搞、充值、发帖、回帖    » 在线充值(10金币=1元)