Web front-end UI framework JQuery WeUI

Posted by gpong on Sat, 28 Dec 2019 16:23:55 +0100

 

Get JQueryUI

http://jqweui.com/

Jquery WeUI is a jQuery implementation version of WeUI. In addition to the official plug-ins, it also provides a variety of extension components such as pull-down refresh, calendar, address selector, etc. The JS components in jQuery WeUI are provided in the form of jQuery plug-ins, which are very convenient to use, and can be used with mainstream JS frameworks such as React, Angular, Vue.js, etc.

WeUI  It is an H5 UI library provided by wechat official team for wechat. It only provides a set of CSS components. Jquery WeUI uses the CSS code of the official WeUI, and provides the API implementation of jQuery/Zepto version. Because the official CSS is used directly, you don't have to worry about conflicts with the official version. Actually, jQuery WeUI == WeUI + jQuery plug-in.

The required css js is available from http://jqweui.com/components   View source get

<!-- head in -->
<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 Last -->
<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>

<!-- If some extension plug-ins are used, additional 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>

Easy to use

Do not use extension plug-ins

<!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>
    <!-- Your content is here -->
</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>

 

Topics: JQuery Javascript React angular