注册    登录
最新消息: 本以为花钱买了那个amh的板面可以让网站更稳定,结果搞得整 个网站运行出错,真是赔了夫人又折兵,对不起大家了。最新版jquery-2.1.1下载  ,在线的 jquery API使用手册, 稳定版jquery.mobile-1.3.2下载

jquery超酷的圆形幻灯片特效Tiny Circleslider

媒体 fishcity 1614浏览

jquery超酷的圆形幻灯片特效Tiny Circleslider

Tinycircleslider是一个基于jquery的圆形幻灯片(滑块/旋转木马)特效插件,它为网页者提供超酷且不同于传统标准的幻灯片特效,幸运的是虽为圆形,但插件非常容易融入到网页中,实现精彩绚丽的小窗口。

特点:

支持IOS 和 Android 系统.

支持AMD, Node, requirejs 和 commonjs.

支持缩略图与翻页滑动

可自动播放和设定播放的间隔时间

同一页可以对齐

拖动完成时选择点消失

幻灯片圆角的大小可以置 

任何移动可引发回调函数.

极易自定义

轻量级

使用方法

引入核心文件

<link rel="stylesheet" href="tinycircleslider.css" type="text/css" media="screen"/>
<script type="text/javascript" src="http://libs.useso.com/js/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.tinycircleslider.js"></script>

构建html代码

<div id="rotatescroll">
		<div class="viewport">
			<ul class="overview">
				<li><a href="http://www.jqcool.net"><img src="images/hdr3.jpg" /></a></li>
				<li><a href="http://www.jqcool.net"><img src="images/hdr2.jpg" /></a></li>
				<li><a href="http://www.jqcool.net"><img src="images/hdr1.jpg" /></a></li>
				<li><a href="http://www.jqcool.net"><img src="images/hdr4.jpg" /></a></li>
				<li><a href="http://www.jqcool.net"><img src="images/hdr5.jpg" /></a></li>
			</ul>
		</div>
		<div class="dot"></div>
		<div class="overlay"></div>
		<div class="thumb"></div>
</div>

写入JS,初始化插件

$(document).ready(function(){
    $('#rotatescroll').tinycircleslider();
});

更多实例效果请参考官方文档

转载请注明:jQ酷 » jquery超酷的圆形幻灯片特效Tiny Circleslider

下载地址:本站下载 | 百度云 | 官方下载
下载说明:
☉如果您发现本文件已经失效不能下载,请联系站长修正!
☉如果您下载的文件出现解压不了或文件受损等情况,请选择其他下载点重新下载。
☉下载本站资源,如果服务器暂不能下载请过一段时间重试!
☉有小部分资源需要解压密码,请输入:jqcool.net。
☉本站提供的所有资源仅供学习研究与参考,请勿用于商业用途。