jQuery Feature Carousel 旋转插件


jQuery Feature Carousel 插件是国外的一比较优秀的旋转木马图片插件。 点击这里进入原文


插件特点:

1.处理div的3d旋转木马效果。

2.支持一个中心,2个侧面的功能

3.中心区域可点击

4.显示隐藏文本功能(可以使用css显示在图片的任何位置)

5.可以修改速度,效果,等很多的参数。

6.支持 Chrome,FireFox,Safari和IE6 +浏览器。

7.需要 jQuery v1.3+

8.支持图片预加载


怎么使用:

1.引入jQuery v1.3+和 carousel.js文件

2.引入相应的css文件

3.格式化你的html。

4.如下启用你的carousel.js

<script type="text/javascript">
  $(document).ready(function () {
    $("#carousel").featureCarousel({
        // include options like this:
        // (use quotes only for string values, and no trailing comma after last option)
        // option: value,
        // option: value
    });
  });
</script>


配置参数:

名称描述类型默认值
largeFeatureWidth3种情况,“0”意思是宽度按原始尺寸显示,“0” “1”之间实际宽度原始宽度乘以此值,大于“1”,可以自定义宽度integer0
largeFeatureHeight同上,为图片的高度integer0
smallFeatureWidth3种情况,“0”意思是宽度按原始尺寸显示,“0” “1”之间实际宽度原始宽度乘以此值,大于“1”,可以自定义宽度integer0.5
smallFeatureHeight同上,改为高度integer0.5
topPadding距离外围容器上方padding值integer20
sidePadding距离外围容器左右padding值integer50
smallFeatureOffset两侧内容举例容器的举例integer50
startingFeature放在中心的序列号integer1
carouselSpeed完成一个旋转木马的时间integer1000
autoPlay大于0的话,为旋转木马的运行间隔时间。等于0表示不自动运行integer4000
pauseOnHove鼠标放上去暂定booleantrue
OnHover鼠标放上去停止booleanfalse
stoptrackerIndividual booleantrue
trackerSummation booleantrue
preload booleantrue
displayCutoff integer0
animationEasing缓存效果(和easing 插件配合使用)string'swing'
leftButtonTag左滚动的按钮string'#carousel-left
rightButtonTag右滚动的按钮string'#carousel-right'
captionBelow标题在图片下方booleanfalse
movedToCenter移入中心触发的回调函数function$.noop
leavingCenter偏离中心触发的回调函数function$.noop
clickedCenter点击中间的链接触发的回调函数function$.noop





  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值