jquery 的3D Carousel插件参数说明

 

这个插件大家都很熟悉了，但是在网上找了很久找不到相关的资料，只有自己琢磨研究了一下。有些参数一眼都可以看出意思，在此我只说一下每个图片要想带一些扩展信息怎么处理。

1：首先需要创建一个ul对象，然后里面每一个li对象中的内容就是一个旋转的图形，第一个需要注意的就是img对象必须放在最前面，然后后面才跟其他内容。

"images/content1.png" alt=""/>
class="tooltip">提示信息
class="url">Real.aspxclass="linkTarget">_self

　　如上所写，img是选择的图片，tooltip是鼠标移动到图片上的提示信息，后面两个data节点的内容是我需要自定义的内容，请注意这里面必须定义class，然后在后面要使用该值时就使用class名称的属性名。

2：创建一个carousel对象

$("#carousel").carousel({width: 400,       //对象宽度 height: 200,      //对象高度itemWidth: 20,posterWidth: 340, //当前显示的图片的宽度posterHeight: 200, //当前显示的图片的高度horizontalRadius: 370, //图片左右滚动的半径verticalRadius: 100,   //图片上下滚动的半径resize: false,mouseScroll: false,mouseDrag: true,scaleRatio: 0.4,scrollbar: false,autoScroll: true,tooltip: true,itemClick: onItemClick,  //自定义每个图片的点击事件mouseWheel: true,mouseWheelReverse: true});

3：选择图片点击事件说明

function onItemClick(evt) {window.location.href = evt.data.url;}

　　在此特别说明：点击事件输入的evt对象，evt.data就是可以自定义的数据， 该控件默认有属性名：path,link,linkTarget,tooltip。属性名就是class名称，在火狐或chrome中定义了link和linkTarget属性，会自动弹出链接窗口。但是在IE8中没有。因此，我自定义了一个url的地址。在Click事件中进行自行处理。