《UI设计》专题
-
Javascript API - Javascript UI Block & Busy API
6.6 ABP表现层 - Javascript UI Block & Busy API ABP提供了有用的API，使整个页面或者页面的某个部分被遮罩层覆盖实现阻塞或者繁忙指示(使用加载图标表示繁忙)。 6.6.4.1 UI Block API 这个API使用一个透明的遮罩层(透明度可调节)来遮住整个页面或者该页面的某个元素。因此用户不能够点击。当你保存表单或者加载某个区域时(某个层或者整个页面)，
-
4.2 如何使用Nuke UI
在上一章节，我们创建了一个 AwesomeProject 项目。 切换到 AwesomeProject 使用你喜爱的编辑器/IDE 打开 AwesomeProject/src/index.jsx，修改其中的代码： 'use strict'; import {createElement, Component} from 'weex-rx'; import {View, Text,Button} fr
-
Kubernator - 更底层的Kubernetes UI
Kubernator相较于Kubernetes Dashboard来说，是一个更底层的Kubernetes UI，Dashboard操作的都是Kubernetes的底层对象，而Kubernator是直接操作Kubernetes各个对象的YAML文件。 Kubernator提供了一种基于目录树和关系拓扑图的方式来管理Kubernetes的对象的方法，用户可以在Web上像通过GitHub的网页版一样操
-
SUI 移动开发UI库V0.6.2 SUI Mobile SUI Mobile 是一套基于 Framework7 开发的UI库。它非常轻量、精美，只需要引入我们的CDN文件就可以使用，并且能兼容到 iOS 6.0+ 和 Android 4.0+，非常适合开发跨平台Web App。 在线阅读：SUI移动开发UI库中文文档 轻量的UI库 SUI Mobile 非常轻量，核心库压缩Gzip后的JS、CSS网络传输体积总共只有
-
jQuery UI 实例 – 定位（Position）
相对窗口、文档、锚、光标/鼠标等元素定位一个元素。 如需了解更多有关 .position() 方法的细节，请查看 API 文档 .position()。 默认功能 使用表单控件配置位置，或者拖拽被定位的元素来修改它的偏移量。向四周拖拽父元素来查看碰撞检测。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <ti
-
jQuery UI 实例 – 切换（Toggle）
使用自定义效果来显示或隐藏匹配的元素。 如需了解更多有关 .toggle() 方法的细节，请查看 API 文档 .toggle()。 .toggle() 演示 点击按钮预览特效。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI 特效 - .toggle() 演示</title>
-
jQuery UI 实例 – 隐藏（Hide）
使用自定义效果来隐藏匹配的元素。 如需了解更多有关 .hide() 方法的细节，请查看 API 文档 .hide()。 .hide() 演示 点击按钮预览特效。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI 特效 - .hide() 演示</title> <link re
-
jQuery UI 实例 – 显示（Show）
使用自定义效果来显示匹配的元素。 如需了解更多有关 .show() 方法的细节，请查看 API 文档 .show()。 .show() 演示 点击按钮预览特效。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI 特效 - .show() 演示</title> <link re
-
jQuery UI 实例 – 特效（Effect）
对一个元素应用动画特效。 如需了解更多有关 .effect() 方法的细节，请查看 API 文档 .effect()。 .effect() 演示 点击按钮预览特效。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI 特效 - .effect() 演示</title> <lin
-
jQuery UI 实例 – 滑块（Slider）
拖动手柄来选择一个数值。 如需了解更多有关 slider 部件的细节，请查看 API 文档 滑块部件（Slider Widget）。 默认功能 基本的滑块是水平的，有一个单一的手柄，可以用鼠标或箭头键进行移动。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI 滑块（Slider
-
jQuery UI 实例 – 菜单（Menu）
带有鼠标和键盘交互的用于导航的可主题化菜单。 如需了解更多有关 menu 部件的细节，请查看 API 文档 菜单部件（Menu Widget）。 默认功能 一个带有默认配置、禁用条目和嵌套菜单的菜单。由一个列表转化成的，添加了主题，并支持鼠标和键盘交互。尝试使用光标键导航菜单。 <!doctype html> <html lang="en"> <head> <meta charset="ut
-
jQuery UI 实例 – 按钮（Button）
用带有适当的悬停（hover）和激活（active）的样式的可主题化按钮来加强标准表单元素（比如按钮、输入框、锚）的功能。 如需了解更多有关 button 部件的细节，请查看 API 文档 按钮部件（Button Widget）。 默认功能 可用于按钮的标记实例：一个 button 元素，一个类型为 submit 的 input 元素和一个锚。 <!doctype html> <html lan
-
jQuery UI 实例 – 排序（Sortable）
使用鼠标调整列表中或者网格中元素的排序。 如需了解更多有关 sortable 交互的细节，请查看 API 文档 可排序小部件（Sortable Widget）。 默认功能 在任意的 DOM 元素上启用 sortable 功能。通过鼠标点击并拖拽元素到列表中的一个新的位置，其它条目会自动调整。默认情况下，sortable 各个条目共享 draggable 属性。 <!doctype html> <
-
jQuery UI 实例 – 选择（Selectable）
使用鼠标选择单个元素或一组元素。 如需了解更多有关 selectable 交互的细节，请查看 API 文档 可选择小部件（Selectable Widget）。 默认功能 在某个 DOM 元素上或者一组元素上启用 selectable 功能。通过鼠标拖拽选择条目。按住 Ctrl 键，选择多个不相邻的条目。 <!doctype html> <html lang="en"> <head> <me
-
jQuery UI 实例 – 缩放（Resizable）
使用鼠标改变元素的尺寸。 如需了解更多有关 resizable 交互的细节，请查看 API 文档 可调整尺寸小部件（Resizable Widget）。 默认功能 在任意的 DOM 元素上启用 resizable 功能。通过鼠标拖拽右边或底边的边框到所需的宽度或高度。 <!doctype html> <html lang="en"> <head> <meta charset="utf-8">