Skip to content

Releases: easysoft/mzui

v1.0.1

09 Jan 07:38
@catouse catouse
v1.0.1
f0f2bcf
Compare
Choose a tag to compare
v1.0.1 Latest
Latest

此版本对桌面端 UI 进行了优化，加入大量实用辅助类，增加了对 jQuery 的支持，并将 ZeptoJS 从标准版中分离，现在可以自行搭配 jQuery 使用。

更新明细

  • 增加了对 jQuery 的支持，将 ZeptoJS 从标准版中分离，现在可以自行搭配 jQuery 最新版本使用。ZeptoJS 版本将不再维护，推荐使用 jQuery；
  • 优化了界面所使用的字体，现在字体集合为 'Helvetica Neue', Helvetica, 'Microsoft Yahei', 'PingFang SC', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', sans-serif;；
  • 优化了在触摸屏上的点击事件，现在使用 touchstart 来代替 tap；
  • 图标：
  • 外观选项：
    • 增加了 .accent、.text-accent 和 .accent-pale 相关着色辅助类；
    • 增加了 .mute-light 和 .muted-dark 来获得不同程度的弱化效果；
    • 优化了状态类效果，而且可以使用 .hover、.focus 和 .active 类来强制获得状态效果；
    • 增加了 .hover-solid 来实现鼠标悬停或触摸时填充背景的效果；
    • 增加了 .divider-top、.divider-left、.divider-right 和 divider-all 来为元素不同方向应用边框鲜果；
    • 增加了 更多的边距外观选项；
    • 增加了 .highlight 类用于为元素应用荧光笔背景效果；
    • 增加了 .long-shadow 类用于为元素应用长阴影效果；
  • 导航：
    • 优化了导航外观，修复了有时会自动换行的问题；
    • 增加了 .nav-lg 和 .nav-sm 类来应用不同大小的导航外观；
  • 列表：
    • 优化了多行列表项外观；
  • 栅格：
    • 优化了单元格的间距，增加了更多控制间距对辅助类（.gutter-lg、.gutter-sm）；
    • 增加了 .single 类，用于禁用行或列换行；
  • 按钮：
    • 优化按钮样式，按钮元素的 display 更改为 inline-flex；
  • 标签：
    • 优化标签样式，标签元素的 display 更改为 inline-flex；
    • 增加了 .label-sm 类用于应用小尺寸的标签外观；
  • 布局：
    • 增加了更多 Flex 辅助类；
    • 增加了对滚动条显示对辅助类（.scroll-x、.scroll-y、.scroll-none）；
  • Display：
    • 增加了 preventDefault 和 stopPropagation 选项来更改点击事件行为；
    • 优化了 placement 选项，现在计算的位置更准确；
    • 增加了对触发元素 data-url 属性对支持，使用此属性来指定远程加载地址可以阻止有时非期望跳转的问题；
  • Ajax 表单：
    • 增加了 onResponse 事件，允许在此事件中格式化服务器返回的内容或者取消此次处理；
    • 优化了 onSubmit 事件，可以在此事件中格式化要提交的表单数据，或者取消此次提交；
    • 优化了 onSuccess 事件，可以在此事件中取消默认处理；
    • 优化了 onError 事件，可以在此事件中取消默认处理；
Assets 3
Loading

v1.0.0

13 Jul 12:46
@catouse catouse
v1.0.0
d66bb74
Compare
Choose a tag to compare
v1.0.0

🎈🎈🎈 MZUI 第一版本！🎈🎈🎈

MZUI 是专为移动端设计，基于 Flex 的 UI 框架。用来开发移动 Web 应用和微信应用非常方便。

文档和示例请访问：http://zui.sexy/m/

mzui-v1 0 0-5

该版本带来的功能包括：

基础内容

  • REM：CSS 定义单位为 REM；
  • 外观选项：提供一组通用的 CSS 修饰类方便为元素和控件定义个性化外观，可定制的内容包括：背景和文本着色、交互状态外观、形状、预设容器类型、内外边距、CSS 变形、阴影和 CSS 滤镜等；
  • 文字排版：预设的文字排版样式；
  • 辅助类：辅助工具类；
  • 布局：包含常用布局容器和 Flex 布局工具类；
  • 栅格：基于 Flex 的栅格体系，同时支持行和列的栅格布局；
  • 动画：提供 CSS 动画辅助类，配合 JavaScript 使用可以方便实现高级交互效果。

控件

  • 标签：支持外观选项；
  • 按钮：包括多种尺寸，支持外观选项；
  • 图标：包括 FontAwesome 字体图标中的绝大部分内容；
  • 头像：包括不同尺寸，支持外观选项；
  • 表格：包括各种常见样式，支持外观选项；
  • 导航：提供固定和自动隐藏功能，支持外观选项；
  • 标题栏：提供一种通用方式来组织标题、图标和导航，支持外观选项；
  • 表单：涵盖常用表单控件，提供表单验证辅助类，全新外观的单选和复选控件；
  • 列表：无论简单还是复杂内容，列表都能轻松应付，支持多层级列表以及外观选项；
  • 代码：包括行内代码和块级代码样式，提供对键盘标记文件样式。

Javascript 插件

  • Display：隆重推出 Display 插件，动态展示内容的好帮手，功能强大，无论是工具提示、对话框、下拉菜单、折叠、远程内容加载都能实现，扩展机制让使用更加方便；
  • 滚动监听：随时监听当前浏览器窗口的滚动状态；
  • Skin.js：提供一种方式来任意定制外观选项中的配色；
  • Color：颜色相关的辅助工具，提供对颜色格式化、转化等相关计算功能；
  • Utils：提供格式化字符串和日期的相关辅助工具；
  • Ajax Form：方便的创建 Ajax 表单。

在官方文档中有更多示例，欢迎访问 http://zui.sexy/m/ 了解更多。

Assets 3
Loading