jQuery圆形轮播图插件circleCarousel

所属分类:媒体-幻灯片和轮播图,图片展示

 33570  341  查看评论 (4)
分享到微信朋友圈
X
jQuery圆形轮播图插件circleCarousel ie兼容11

使用方法

在页面中引入jquery、circle.js和circle.css文件。

<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/circle.js"></script>
<link rel="stylesheet" href="css/circle.css">

HTML结构

该jQuery圆形轮播图的HTML结构如下。

<div>
    <div>
        <span data-tab="1">
     Item 1
     <span ></span>
        </span>
        <span data-tab="2">
     Item 2
     <span ></span>
        </span>
        <span data-tab="3">
     Item 3
     <span ></span>
        </span>
        <span data-tab="4">
     Item 4
     <span ></span>
        </span>
        <span data-tab="5">
     Item 5
     <span ></span>
        </span>
        ...
    </div>

    <div>
        <div>
            TEXT SAMPLE FOR ITEM 1
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 2
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 3
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 4
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 5
        </div>
    </div>

</div>
相关插件-幻灯片和轮播图,图片展示

易迅分块jquery焦点图

上下切换、分块展示
  幻灯片和轮播图
 28762  304

SuperSlidev2.1焦点图幻灯片tab

SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。 网站上常用的“焦点图/幻灯片”“Tab标签切换”“图片滚动”“无缝滚动”等只需要一个SuperSlide即可解决!
  幻灯片和轮播图
 49726  427

伪3D焦点图

伪3D焦点图
  幻灯片和轮播图
 42181  372

HTML5 svg全屏图片切换遮罩动画

svg全屏图片切换遮罩动画
  幻灯片和轮播图
 39738  366

讨论这个项目(4)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    A/Service ? restart 0
    2021/3/3 9:26:45
    大神,如何调整自动旋转的时间? 回复
    钱志强 0
    2019/3/29 16:03:31
    转一圈的,太厉害,感觉屏幕都在抖啊~体验很差啊 回复
    执 0
    2019/1/22 20:05:31
    有个顿闪bug 应该是有分辨率问题
        sohopeter0
        2019/1/23 15:40:08
        哦,那研究一下,不断更新
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复