转载

带图片倒影的jQuery响应式3D旋转木马插件

简要教程

mk-3Dcarousel是一款带图片倒影效果的响应式3D旋转木马 jQuery插件 。该旋转木马使用简单,可以生成非常漂亮的图片倒影效果,可以在所有最新版本的现代浏览器中正常工作。

该旋转木马插件在小屏幕中会以另一种不同的风格进行图片展示。

带图片倒影的jQuery响应式3D旋转木马插件

查看演示       下载插件

使用方法

使用该3D旋转木马插件需要引入jQuery、mk-3Dcarousel.js和mk-3Dcarousel.css文件。

HTML结构

mk-3Dcarousel 3D旋转木马插件的HTML结构非常简单:使用一个<div> 元素作为包裹容器,里面放置需要的图片即可。

带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件 带图片倒影的jQuery响应式3D旋转木马插件

初始化插件

在页面DOM元素加载完毕之后,可以通过下面的方法来初始化该3d旋转木马插件。

$(function(){     $('#mkCarousel').mkCarousel(); });

配置参数

该3d旋转木马插件有以下一些可用的配置参数:

responsive:是否开启响应式效果,默认值为true。

breakpoint:响应式断点,默认值为768。

offset:偏移值(桌面设备),默认值为100。

mobileOffset:偏移值(移动手机),默认值为50。

controlNavs:是否显示导航控制,默认值为true。

推荐阅读: 超酷jQuery 3D旋转木马效果轮播图插件

来源jQuery之家

正文到此结束
Loading...