allinone rotator演示40种不同的焦点图轮播

来源:https://www.sucaihuo.com/js/249.html 2015-08-20 06:29浏览(4722) 收藏

allinone 有15种类型,16 种过渡效果、支持文字左右上下四个方向的动画效果、支持 touch 滑动事件;可设置是否自动播放、是否循环播放、是否显示控制器、倒计时。它的功能非常强大,而且每款皮肤都很漂亮,任何焦点图轮播需求都可以用allinone轻松搞定。
allinone rotator演示40种不同的焦点图轮播
分类:图片代码 > 图片轮播 难易:中级
查看演示 下载资源 下载积分: 20 积分

allinone 支持响应式设计,在移动端都可以很好的展示。下面有演示,你可以点击“响应式”的演示,然后改变窗口大小。

allinone 有5个不同作用的js:

<ul class='ul_demo'>
<li>allinone_bannerRotator.js 横幅</li>
<li>allinone_thumbnailsBanner.js 带缩略图</li>
<li>allinone_bannerWithPlaylist.js 带播放列表</li>
<li>allinone_contentSlider.js 带内容</li>
<li>allinone_carousel.js 3D旋转木马</li>
</ul>
<dl class="dl">
<dt>横幅(allinone_bannerRotator.js)</dt>
<dd><img alt="" src="../jquery/2/249/demo/test/1.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_1_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_1_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/2.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_2_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_2_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_2_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/3.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_3_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_3_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_1_3_3.html" target="_blank">响应式</a></dd>
<dt>带缩略图(allinone_thumbnailsBanner.js)</dt>
<dd><img alt="" src="../jquery/2/249/demo/test/4.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_1_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_1_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_1_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/5.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_2_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_2_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_2_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/6.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_2_3_1.html" target="_blank">固定尺寸</a></dd>
<dt>带播放列表(allinone_bannerWithPlaylist.js)</dt>
<dd><img alt="" src="../jquery/2/249/demo/test/7.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_1_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_1_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_1_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/8.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_2_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_2_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_2_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/9.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_3_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_3_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_3_3_3.html" target="_blank">响应式</a></dd>
<dt>带内容(allinone_contentSlider.js)</dt>
<dd><img alt="" src="../jquery/2/249/demo/test/10.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_1_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_1_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_1_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/11.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_2_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_2_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_2_3.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/12.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_3_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_3_2.html" target="_blank">全屏</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_4_3_3.html" target="_blank">响应式</a></dd>
<dt>3D旋转木马(allinone_carousel.js)</dt>
<dd><img alt="" src="../jquery/2/249/demo/test/13.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_5_1_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_5_1_2.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/14.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_5_2_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_5_2_2.html" target="_blank">响应式</a></dd>
<dd><img alt="" src="../jquery/2/249/demo/test/15.jpg"><a href="http://www.sucaihuo.com/jquery/2/249/demo/index_5_3_1.html" target="_blank">固定尺寸</a> <a href="http://www.sucaihuo.com/jquery/2/249/demo/index_5_3_2.html" target="_blank">响应式</a></dd>
</dl>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2