码迷,mamicode.com
首页 > 其他好文 > 详细

【前端UI】Fuck UI 之最初版(一)

时间:2015-01-04 01:09:59      阅读:271      评论:0      收藏:0      [点我收藏+]

标签:

 写ui的起因

现今UI确实有很多,有的很强大,功能很全;有的很简洁,使用很方便,兼容性不错,功能也是很强大很全;要是让我一个非前端专业的写一个UI和它们比较那简直不自量力了。既然它们的已经那么强大了,为何自己要写一套呢? 其实都懂,适用自己的项目需要的UI才是好的,很多功能其实压根目前用不到,而且在浏览器兼容方面,自己想要的效果方面都不能如自己的意愿,因为功能太强大,没有那个能力去改进,去扩展。 最重要的一点,很多UI感觉适合做做后台系统,一般的网站使用起来还是比较不适用的。

个人拙见,多多指教!

进入正题

下载:http://pan.baidu.com/s/1kT21gSB

上面链接为fkui的js文件和css文件,使用说明里面有word文件,写的不是很好,请见谅了。

头文件引用:

<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<link href="fkui1.1/themes/default/fkui.min.css" rel="stylesheet" />
<script src="fkui1.1/fkui.min.js")"></script>

对话框窗口(dialog)

<script>
    function openDialog() {
        $("#dialog").dialog(‘open‘);
    }

    $(function () {
        $("#dialog").dialog({
            title: ‘我是标题‘
            , width: 450
            , height: 200
            , onOk: function () {
                alert("确定按钮被点击");
            }
        });
    });
</script>

Html:

<div id="dialog" >内容</div>

 

  

 下来框(combobox)

$(‘#cc‘).combobox({
     , data: [{Key:‘1‘,Value:‘项目1‘},{Key:‘2‘,Value:‘项目2‘}]
     , valueField: ‘Key‘
     , textField: ‘Value‘
});

Html:

<select id="cc" ></select>

 文本框(validatebox)

<input id="dd" class="fkui-validatebox" data-options="
            placeholder: ‘请输入数字‘
            , required: true
            , emptyMsg: ‘不能为空‘
            , validType: [‘number‘, ‘length[2,5]‘]
            , msg: ‘请输入数字‘
            , styleMode: ‘static‘" />

【前端UI】Fuck UI 之最初版(一)

标签:

原文地址:http://www.cnblogs.com/helihui123/p/4200205.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!