Web前端UI框架 JQuery WeUI
阿新 • • 發佈:2018-12-11
獲取JQueryUI
jQuery WeUI 是 WeUI 的一個 jQuery 實現版本,除實現了官方外掛之外,它還提供瞭如下拉重新整理、日曆、地址選擇器等豐富的拓展元件。jQuery WeUI 中的 JS 元件均是以 jQuery 外掛的形式提供,使用非常方便,並且可以和 React、Angular、Vue.js 之類的主流 JS 框架一起使用。
WeUI 是微信官方團隊針對微信提供的一個 H5 UI 庫,它只提供了一組 CSS 元件。jQuery WeUI 中使用的是官方 WeUI 的 CSS 程式碼,並提供了 jQuery/Zepto 版本的 API 實現。因為直接使用了官方的 CSS,所以你不用擔心跟官方版本的衝突。實際上 jQuery WeUI == WeUI + jQuery外掛。
<!-- head 中 --> <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css"> <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css"> <!-- body 最後 --> <script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script> <script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/jquery-weui.min.js"></script> <!-- 如果使用了某些拓展外掛還需要額外的JS --> <script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/swiper.min.js"></script> <script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/city-picker.min.js"></script>
簡單使用
不使用拓展外掛
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="./css/weui.css"> <link rel="stylesheet" type="text/css" href="./css/jquery-weui.css"> </head> <body> <!-- 你的內容在這裡 --> </body> <script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="./js/jquery-weui.js"></script> </html>