jQuery MiniUI

标题: 关于皮肤的问题 [打印本页]

作者: wudigongzi 时间: 2013-11-1 10:33:28 标题: 关于皮肤的问题

我在查阅miniui的时候，看到在themes下有好几个皮肤css，不知道该怎么应用？
是否可以做一个示例出来，能够让用户自动切换想要的皮肤呢？感觉这个功能应该会比较好的，而且，最好能有个什么教程，使得我们可以去自定义皮肤样式之类的。这样，miniui的人性化程度就提高了，还有个就是，miniui的控件都是尖角的，能否涉及点圆角的样式出来呢？现在其他主流的框架像extjs,easyui之类的貌似都是圆角的了。最好这种样式也能够有个什么js脚本让我们自己去做切换。

作者: langben 时间: 2013-11-1 10:40:40

easyui

皮肤切换请参照demo（推荐Blue）选择皮肤的代码

首先圆角只是在ie9以上支持，ie8-是不支持的

作者: factory 时间: 2013-11-1 10:56:13

1.我们提供的demo,运行试用包里面的 demo/index.html,右上角是有个皮肤切换的下拉框的

2.皮肤的替换: 首先你要引用 miniui/theme/default/miniui.css
然后在这基础上,再引用对应皮肤的skin.css

3.圆角效果在目前版本的miniui上,在IE9以及以上,FF和chrome上是支持圆角效果的,其他的低版本的IE不支持.
圆角效果无非是用CSS做(这个需要浏览器版本支持),或者就是用图片,但是图片如果需要支持按钮的高宽自定义的话,那么他的dom结构也会需要比较复杂,如果页面上有多个这样的按钮,性能开销会增加很多.

所以目前的版本暂时是用CSS来实现的,但是在低版本IE下无效. 后续版本会推出所有版本都支持的圆角

作者: wudigongzi 时间: 2013-11-1 11:14:31

factory 发表于 2013-11-1 10:56
1.我们提供的demo,运行试用包里面的 demo/index.html,右上角是有个皮肤切换的下拉框的

2.皮肤的替换: 首先 ...

那如果我想要有个圆角的特效，应该怎么样才能调用到呢?是否可以进行统一的设置呢？比如我可以在页面加载的时候去判断下页面是哪个ie版本的，然后我再进行判定是否选用圆角设置

作者: langben 时间: 2013-11-1 11:23:10

一般实现低版本圆角的思路
四个圆角图片整合为一张图片
使用css的background,width,height 进行图片切割
需要圆角的控件放置4个方位的圆角标签
这样高度和宽度可以自定义

如果宽度和高度定死
可以自制一个圆角背景图放置到标签容器中

作者: factory 时间: 2013-11-1 13:12:22

wudigongzi 发表于 2013-11-1 11:14
那如果我想要有个圆角的特效，应该怎么样才能调用到呢?是否可以进行统一的设置呢？比如我可以在页面加载 ...

恩,langben已经说了,但是因为按钮的html结构是内部JS生成的,而且现在的按钮结构也是无法去做成适应高宽,并且圆角的效果,所以目前的miniui按钮,对于低版本的浏览器,就是无法支持圆角的效果

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)