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

原创|使用教程|编辑:我只采一朵|2014-05-16 14:18:32.000|阅读 3120 次

概述:本文介绍Kendo UI API之AutoComplete,介绍打开和关闭动画的相关配置。

相关链接:

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

Configuration


animation Object

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

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

<input id="autocomplete" />
<script>
$("#autocomplete").kendoAutoComplete({
animation: false
});
</script>

示例:配置动画

<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

示例:配置关闭动画

<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

示例:配置打开动画

<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

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

慧都特邀Kendo UI原厂开发工程师举行线上公开课,使用该控件的朋友千万别错过哦>>查看详情

kendo ui线下培训



标签:APIKendoUI

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果

文章转载自:慧都控件

登录慧都网发表评论登录


暂无评论...

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
title
相关厂商
相关产品
Kendo UI Web

运用JavaScript和HTML5就能快速创建性能最优的Web应用程序

Kendo UI Mobile

使用HTML5和JavaScript快速开发跨平台原生移动应用程序的移动应用程序框架

Kendo UI DataViz

跨平台跨设备的数据可视化组件

Kendo UI Server Wrappers

帮助你开发基于Kendo UI的出色的HTML5应用程序,并且无需亲自编写JavaScript。

Kendo UI Core

Kendo UI Core是Kendo UI的开源免费版,是HTML5构架下的用于网络和移动开发的工具。

Kendo UI

全新升级的Kendo UI,是创建数据丰富的Web应用程序的最完整UI库。

在线客服 在线QQ 电话咨询
400-700-1020
反馈
在线客服系统
live chat