KendoUI的窗口使用demo

kendoui簡介

目前移動HTML5帶UI的開發框架層出不窮,常見的有Sencha Touch、jQuery Mobile前者效果較好,收費,學習成本高;後者效果一般,但兼容性好,免費,學習成本低,會jquery的同學上手快。其實還有一個夾在兩者之間的框架叫Kendo UI.

kendoui常用組件

kendo UI web確實是一個很優秀的框架,裡面主要含有組件為以下幾種:

常見組件列表:

AutoComplete 自動補齊
Calendar組件 日曆表
ColorPicker 顏色選擇器
ComboBox 下拉列表框
DatePicker 日期選擇組件
DateTimePicker 日期時間控件
DropDownList 下拉菜單
Editor 在線編輯器
Grid 表格組件
ListView 列表視圖
Menu 菜單
MultiSelect 多選框
NumericTextBox 數值文本框
PanelBar 手風琴選項卡
Scheduler 日程調度表
Slider 滑動控制器
Splitter 界面分割符

TabStrip 選項卡
TimePicker 時間選擇器
Tooltip 提示工具
TreeView 樹型視圖
Window 彈窗

window窗口

今天先來學習下窗口的簡單使用,讓大家體驗下它的簡單使用:

KendoUI的窗口使用demo

這就是窗口的彈出。

我們來看一下它的代碼:

 myWindow.kendoWindow({
width: "600px",
title: "About Alvar Aalto",
visible: false,
actions: [
"Pin",
"Minimize",
"Maximize",
"Close"
],
close: onClose
}).data("kendoWindow").center().open();

只要定義一個div

 

然後我們就可以用它自身的方法調用了,而且樣式好看,簡單方便的開發系統。

好了,今天帶大家入門瞭解一下,以後我詳細介紹它的使用來和大家分享。


分享到:


相關文章: