YDUI-Touch移動(dòng)端和微信 UI
一只注重審美，且性能高效的移動(dòng)端&微信UI。
專屬于移動(dòng)
YDUI Touch 專為移動(dòng)端打造，在技術(shù)實(shí)現(xiàn)、交互設(shè)計(jì)上兼容主流移動(dòng)設(shè)備，保證代碼輕、性能高。
采用 Flex 布局
使用 Flex 技術(shù)，靈活自如地對(duì)齊、收縮、擴(kuò)展元素，輕松搞定移動(dòng)頁(yè)面布局。
用 rem 來(lái)做響應(yīng)式開發(fā)
實(shí)現(xiàn)強(qiáng)大的屏幕適配布局，等比例適配所有屏幕。什么？用得不開心？輕松切換 px。
高端定制
自定義Javascript組件、Less文件、Less變量，定制一份屬于自己的YDUI。
基于jQuery
YDUI JS 組件基于 jQuery 2.0+ 開發(fā)；不能接受？別罵我！
同時(shí)支持 jQuery 和 Zepto，真是吃力不討好！
先別走，YDUI 還為你提供了很多漂亮樣式組件！
兼容性
兼容絕大多數(shù)移動(dòng)端設(shè)備（兼容Android4.0+、IOS6.0+）；
如果不兼容你的JJ，請(qǐng)?jiān)谧钕路搅粞愿嬖V我（操作系統(tǒng)及版本 + 瀏覽器及版本）；
采用 flexbox 布局，因低版本安卓及部分特殊瀏覽器不兼容flex-basis、flex-wrap、inline-flex屬性，YDUI 將采取其他解決方案；
目錄結(jié)構(gòu)
獲取 YDUI
通過(guò) YDUI Touch 定制，定制屬于自己的 YDUI，然后下載zip壓縮包；
下載包目錄結(jié)構(gòu)
YDUI Touch | |-- build // 代碼已壓縮 | |-- css | | |-- ydui.css // 已將圖標(biāo).ttf轉(zhuǎn)base64 | |-- js | |-- ydui.flexible.js | |-- ydui.js | |-- demo // 所有示例文件 | |-- css | | |-- demo.css // 示例用到的樣式（項(xiàng)目無(wú)需使用） | | |-- ydui.css | |-- html | |-- *.html | |-- js | |-- ydui.flexible.js | |-- ydui.js | |-- index.html // 示例入口文件
使用
獲取到 YDUI 后，在head標(biāo)簽內(nèi)引入path/build/css/ydui.css和path/build/js/ydui.flexible.js文件；
凡涉及js組件需另外引入jquery 2.0+和path/build/js/ydui.js；
您可以復(fù)制下面代碼或在線預(yù)覽。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<!-- 引入YDUI樣式 -->
<link rel="stylesheet" href="path/build/css/ydui.css" />
<!-- 引入YDUI自適應(yīng)解決方案類庫(kù) -->
<script src="path/build/js/ydui.flexible.js"></script>
</head>
<body>
<div class="g-view">
<!-- 使用：樣式模塊以按鈕為例 -->
<div class="m-button">
<a href="javascript:;" class="btn-block btn-primary" id="J_Btn">Button</a>
</div>
</div>
<!-- 引入jQuery 2.0+ -->
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<!-- 引入YDUI腳本 -->
<script src="path/build/js/ydui.js"></script>
<script>
!function ($) {
$('#J_Btn').on('click', function () {
/* 使用：js模塊以dialog為例 */
YDUI.dialog.alert('我有一個(gè)小毛驢我從來(lái)也不騎！');
});
}(jQuery);
</script>
</body>
</html>