Kendo UI API中文介绍二:AutoComplete (1)

温馨提示:Kendo UI AutoComplete必须使用input HTML元素。AutoComplete具有配置元素22个,字段元素4个,方法12个以及事件5个。

Configuration


animation Object

配置建议窗口的打开和关闭动画。将animation设置为false时会禁用打开和关闭动画,其结果就是建议窗口而直接打开和关闭,没有动画。

示例:如何禁用打开和关闭动画

1
2
3
4
5
6
<input id="autocomplete" />
<script>
$("#autocomplete").kendoAutoComplete({
animation: false
});
</script>

示例:配置动画

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<input id="autocomplete" />
<script>
$("#autocomplete").kendoAutoComplete({
animation: {
close: {
effects: "fadeOut zoom:out",
duration: 300
},
open: {
effects: "fadeIn zoom:in",
duration: 300
}
}
});
</script>
 
<input id="autocomplete" />
<script>
$("#autocomplete").kendoAutoComplete({
animation: {
close: {
effects: "fadeOut zoom:out",
duration: 300
},
open: {
effects: "fadeIn zoom:in",
duration: 300
}
}
});
</script>

animation.close Object

示例:配置关闭动画

1
2
3
4
5
6
7
8
9
10
11
<input id="autocomplete" />
<script>
$("#autocomplete").kendoAutoComplete({
animation: {
close: {
effects: "zoom:out",
duration: 300
}
}
});
</script>

animation.close.duration Number(default: 100)

关闭动画的持续时间是以毫秒计算的。

animation.close.effects String

关闭动画的效果是以字符串的形式表示的,多个效果之间用空格隔开。有哪些可用的动画效果?请猛戳这里

animation.open Object

示例:配置打开动画

1
2
3
4
5
6
7
8
9
10
11
<input id="autocomplete" />
<script>
$("#autocomplete").kendoAutoComplete({
animation: {
open: {
effects: "zoom:in",
duration: 300
}
}
});
</script>

animation.open.duration Number(default: 200)

打开动画的持续时间以毫秒计算,默认是200毫秒。

animation.open.effects String

转载于:https://my.oschina.net/u/2325007/blog/405687

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值