CoverFlow - 3D音乐专辑封面jQuery特效

jQuery Coverflow 是一款效果非常炫酷的苹果 3D 音乐专辑封面 CoverFlow 特效 jQuery 插件。该 CoverFlow 特效支持鼠标滚动、移动触摸、图片倒影和复杂的 CSS3 动画。CoverFlow 特效的特点有：

• 支持单独的 CSS 文件
• 可以使用键盘的 Home，End，Page Up，Page Down 键进行控制
• 如果浏览器支持会使用 CSS3 transformations，否则会自动回退
• 支持动画的 easing 和 duration
• 支持定制 CSS transition 代码以及 CSS3 filters 等特殊效果
• 内置支持鼠标滚动事件
• 可以选用 interpolate.js 来支持复杂的 CSS 动画
• 可以选用 Reflections.js 来支持倒影效果
• 可以选用 TouchSwipe 来支持移动触摸设备

HTML 结构:

该 CoverFlow 特效插件的基本 HTML 结构如下。

初始化插件:

在页面加载完毕之后通过下面的方法来初始化该 CoverFlow 特效插件。

配置参数:

duration (integer/string, default: "normal")：动画的速度。可以使用："slow"、"normal"、"fast"或一个一毫米为单位的整数

easing (string, default: undefined)：定义滚动的 easing 效果。如果没有定义，默认使用"swing"效果

index (string, integer: 0)：初始化时旋转的 index

innerAngle (float, integer: -75)：inner covers 的角度，单位为 degrees。负数表示封面向内旋转，正数表示封面向外旋转

innerCss (object, default: undefined)：包含 inner covers 的 CSS 属性的对象。如果不需要改变 CSS 不用定义这个参数

outerAngle (float, integer: -30)：outer covers 的角度，单位为 degrees。负数表示封面向内旋转，正数表示封面向外旋转

outerCss (object, default: undefined)：包含 outer covers 的 CSS 属性的对象。如果不需要改变 CSS 不用定义这个参数

selectedCss (object, default: undefined)：包含已选择 covers 的 CSS 属性的对象。如果不需要改变 CSS 不用定义这个参数

方法:

cover：作为一个 jQuery 对象来获取当前选择的封面图片

index：获取或设置当前的 index。如果没有提供值，会返回当前的 index 值

refresh：重新渲染封面。在添加或移除封面或改变封面时才需要调用这个方法

事件

change：在当前封面的 index 发送改变时触发。Callback: function(event, cover, index)

confirm：当用户点击当前封面时触发。Callback: function(event, cover, index)

select：当一个封面被选择时触发。Callback: function(event, cover, index)

animateStep：在每一个动画帧中触发。Callback: function(event, cover, offset, isVisible, isMiddle, sin, cos)

animateComplete：在动停止时触发。Callback: function(event, cover, offset, isVisible, isMiddle, sin, cos)

更多关于该 CoverFlow 特效插件的信息请参考：https://github.com/vanderlee/coverflow

CoverFlow - 3D 音乐专辑封面 jQuery 特效

已有 612 人购买

• 永久更新：
• 演示数据：

此资源下载价格为1元立即购买（VIP 免费）立即升级

查看演示升级 VIP立刻购买

演示地址

下载地址

咨询客服 中文演示

专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！