轮播 Carousel

Constructor

Implements: Widget

Tutorials: 控件对象使用快速入门

可设置的属性

Name	Type	Default	Description
name	String		控件的名字，唯一标志
title	String		控件title
hidden	Boolean		隐藏
value	String		值
readonly	Boolean		只读
width	Number		宽度
height	Number	400	高度
arrow	String	hover	箭头按钮显示方式（hover悬停显示 always始终显示 none不显示）
indicator	String	inside	指示器显示位置（inside容器内部 outside容器外部 none不显示）
autoplay	Boolean	true	是否自动切换
interval	Number	3000	自动切换间隔（不能少于800ms）

可读取的属性

Name	Type	Default	Description
name	String		控件的名字，唯一标志
title	String		控件title
hidden	Boolean		隐藏
value	String		值
readonly	Boolean		只读
width	Number		宽度
height	Number	400	高度
arrow	String	hover	箭头按钮显示方式（hover悬停显示 always始终显示 none不显示）
indicator	String	inside	指示器显示位置（inside容器内部 outside容器外部 none不显示）
autoplay	Boolean	true	是否自动切换
interval	Number	3000	自动切换间隔（不能少于800ms）

方法

intoView

Description： 把控件移动到页面可视范围

调用举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.doMethod('intoView');

fullscreen

Description： 全屏

调用举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.doMethod('fullscreen');

restore

Description： 退出全屏

调用举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.doMethod('restore');

next

Description： 切换下一个

调用举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.doMethod('next');

Prev

Description： 切换上一个

调用举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.doMethod('prev');

事件

slide

Description： 切换事件

Name	Description
回调函数参数	index：Number切换的索引 prevIndex：Number上一个索引 item：Objectdom对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('slide' , function(index , prevIndex , item){
    vjsp.alert('切换到：'+index);
});

clickItem

Description： 某一项点击事件

Name	Description
回调函数参数	index：Number切换的索引 item：Objectdom对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('clickItem' , function(index , item){
    vjsp.alert('点击的索引：'+index);
});

click

Description： 单击

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('click' , function(e){
    vjsp.alert('click event');
});

dblclick

Description： 双击

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('dblclick' , function(e){
    vjsp.alert('dblclick event');
});

contextmenu

Description： 弹出上下文菜单

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('contextmenu' , function(e){
    vjsp.alert('contextmenu event');
});

mousedown

Description： 鼠标按下

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mousedown' , function(e){
    vjsp.alert('mousedown event');
});

mouseup

Description： 鼠标弹起

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mouseup' , function(e){
    vjsp.alert('mouseup event');
});

mousemove

Description： 鼠标移动

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mousemove' , function(e){
    vjsp.alert('mousemove event');
});

mouseover

Description： 鼠标移动控件上

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mouseover' , function(e){
    vjsp.alert('mouseover event');
});

mouseout

Description： 鼠标离开

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mouseout' , function(e){
    vjsp.alert('mouseout event');
});

mouseenter

Description： 鼠标移入

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mouseenter' , function(e){
    vjsp.alert('mouseenter event');
});

mouseleave

Description： 鼠标移出

回调函数参数

Name	Type	Description
e	Object	jQuery事件对象

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('mouseleave' , function(e){
    vjsp.alert('mouseleave event');
});

hidden

Description： 隐藏事件（隐藏显示触发 回调参数为隐藏状态）

回调函数参数

Name	Type	Description
hiddenState	Boolean	隐藏状态true为隐藏、false为取消隐藏

绑定举例：

var widget = vjsp.Parser.getWidgetByName('carousel');
widget.on('hidden' , function(hiddenState){
    if(hiddenState){
        vjsp.alert('控件被隐藏');
    }else{
        vjsp.alert('控件取消隐藏');
    }
});