WeUI | 易学教程

注册发送验证码提示信息

阅读更多关于注册发送验证码提示信息

手机号注册需要用正则判断；点击发送按钮提示输入框不为空；这个例子是基于移动端: HTML代码：　　//提示信息<header> <div class="mate_toast"> <div class="mate_toastDiv"> <div class="mate_toastText"></div> </div> </div> </header>//输入框 <section class="content"> <div class="weui-cells weui-cells_form"> <div class="phone_mation"> <div class="weui-cell__hd"> <label class="weui-label"><span>* </span>手机</label> <input class="weui-input-phone" type="text" id="iphone"> </div> </div> <div class="weui-cell weui-cell_active weui-cell_vcode"> <div class="weui-cell__hd"><label class="weui-labels"><span>* </span>验证码</label></div> <input autofocus="" class=

WeUI实例(官方)

阅读更多关于 WeUI实例(官方)

博主最近想用小程序画几个页面，于是想试试WeUI的样式。但是没找到WeUI的文档，只找到了在线的实例演示。还有的例子是在div上显示的，当时比较疑惑。后来发现，可能是公众号的页面。实例演示的链接：传送门其实这些实例的代码我们在github下载WeUI的时候已经clone到本地了。在这个位置： example文件夹存放了实例的源码，你可以参考这个来使用WeUI，还是很有意思的。不过不要忘记引用css样式。还有一个细节：样式中类似于weui-form_text-area的标签，下划线是两个，使用一个和两个样式是不一样的。博主也是刚刚学习Weui和小程序，有问题欢迎在评论指出。有则改之，无则加勉。来源： CSDN 作者： mirror6 链接： https://blog.csdn.net/LY121600HACKER/article/details/104571452

前端框架、前端工具记录（更新中....）

阅读更多关于前端框架、前端工具记录（更新中....）

一、工具前端工具库： http://www.w3cfuns.com/tools.php DCloud - HBuilder : http://www.dcloud.io Webstorm： http://www.jetbrains.com/webstorm/ easyicon图标： http://www.easyicon.net/ 阿里巴巴矢量图标库： http://www.iconfont.cn/ 二、框架 MUI-最接近原生APP体验的高性能前端框架：网址： http://dev.dcloud.net.cn/mui/ ZUI ( 一个基于Bootstrap深度定制开源前端实践方案，帮助你快速构现代跨屏应用)：官网： http://zui.sexy/ **H-ui 前端框架（适合中国网站）： ** 官网： http://www.h-ui.net/index.shtml oschina： http://www.oschina.net/p/h-ui/similar_projects?lang=0&sort=time&p=1 amazeui （中国首个跨Html 5 前端框架）：官网： http://amazeui.org/?_ver=2.x Bootstrap （是最受欢迎的HTML、CSS和JS kaungjia , 用于开发响应时布局，移动设备有限的WEB项目）：官网

微信小程序之登录页并存储用户

阅读更多关于微信小程序之登录页并存储用户

效果图： login.wxml：  <view class="container"> <view class="login-icon"> <image class="login-img" src="/images/logo.png"></image> </view> <view class="login-from"> <form bindsubmit="formSubmit" class='form'> <view class="myno">  <view class="weui-cell weui-cell_input"> <image class="nameImage" src="/images/name.png"></image>  <view class="weui-cell__bd"> <input class="weui-input" name="no" bindinput="noinput" value='{{no}}' placeholder="请输入学号" /> </view> </view> </view> <view

weui 的tabbar如何固定在底部

阅读更多关于 weui 的tabbar如何固定在底部

<!DOCTYPE html> <html lang="zh-CN" xmlns:th="http://www.thymeleaf.org" style="height:100%;"> <body style="height:100%;"> <div class="page" style="height:100%;"> <div class="page__bd" style="height: 100%;"> <div class="weui-tab"> <div class="weui-tab__panel"> </div> <div class="weui-tabbar tab-bottom"> <a th:onclick="'javasctipt:gototitlecard()'" class="weui-tabbar__item weui-bar__item_on"> <span style="display: inline-block;position: relative;"> <img src="./images/icon_tabbar.png" alt="" class="weui-tabbar__icon"> <span class="weui-badge" style="position: absolute;top: -2px;right: -13px;">8<

移动端前端UI库—Frozen UI、WeUI、SUI Mobile

阅读更多关于移动端前端UI库—Frozen UI、WeUI、SUI Mobile

Frozen UI 自述：简单易用，轻量快捷，为移动端服务的前端框架。主页：http://frozenui.github.io/ 开发团队：QQVIP FD Team Github：https://github.com/frozenui/frozenui Demo：http://frozenui.github.io/frozenui/demo/index.html WeUI 自述：WeUI是一套同微信原生视觉体验一致的基础样式库，为微信 Web 开发量身设计，可以令用户的使用感知更加统一。开发团队：Wechat Official Design Team Github：https://github.com/weui/weui Demo：http://weui.github.io/weui/ SUI Mobile 主页：http://m.sui.taobao.org/ 自述：轻量、小巧、精美的UI库，方便迅速搭建手机H5应用，也非常适合开发跨平台Web App。开发团队：阿里巴巴共享业务事业部UED团队 Github：https://github.com/sdc-alibaba/SUI-Mobile Demo：http://m.sui.taobao.org/demos/ 兼容：兼容到 iOS 6+ 以及 Android 4.0+ 基于 Framework7 进行开发，并参考

小程序开发初体验，从静态demo到接入Bmob数据库完全实现

阅读更多关于小程序开发初体验，从静态demo到接入Bmob数据库完全实现

之前我胖汾公司年会、问我能不能帮忙搞个小程序方便他们进行游戏后的惩罚/抽奖使用、出了个简单的设计图、大概三天左右做了个简单的小程序、目前提交审核了。对于写过一小段时间vue来说小程序很容易上手、写法和结构差不多。 ----------------- 这里整理的内容大致划分四个部分 ①常规选型 ②静态页面 ③接入Bmob数据库 ④发布小程序 ⑤个人开发过程的笔记。 ------------------ 小程序-萌小福团建（密钥：20190101）静态完整代码： https://github.com/GugaLiz/GamePunishment/tree/master 接入Bmob数据库后的完整代码： https://github.com/GugaLiz/GamePunishment/tree/br/2.x ===============================常规选型 =============================== 1.小程序开发官方文档 ①简易教程（第一次开发小程序请务必看完简易教程这一页好吗？答应我！主要是看看怎么申请小程序和安装上开发工具，有公众号的注意，登录页面跟公众号是一样的，根据你的登录账户区分登录公众号还是小程序的！！！）：https://developers.weixin.qq.com/miniprogram/dev/ ②组件：https:/

挖坑记录_Jquery-Weui weui-tabbar组件沉底

阅读更多关于挖坑记录_Jquery-Weui weui-tabbar组件沉底

今天使用JQuery-Weui 发现weui-tabbar 不沉底，查询了一下相关资料，要给父容器增加高度。问题解决；另外，需要动态设置好每个DIV得高度，使父容器高度永远等于设备分辨率高度，并计算好每个DIV得高度使样式贴合 HTML： <div id="container"> <div class="title">订单列表</div> <div id="mainDiv" style="overflow:auto;"></div> <div class="weui-tabbar"> <a href="#tab1" class="weui-tabbar__item weui-bar__item--on"> <span class="weui-badge" style="position: absolute;top: -.4em;right: 1em;">8</span> <div class="weui-tabbar__icon"> <img src="./images/icon_nav_button.png" alt=""> </div> <p class="weui-tabbar__label">微信</p> </a> <a href="#tab2" class="weui-tabbar__item"> <div class="weui-tabbar__icon">

微信小程序之问卷调查

阅读更多关于微信小程序之问卷调查

登录界面 login.js // miniprogram/pages/login/login.js Page ( { data : { username : null , password : null , currentId : null , } , formLogin : function ( e ) { //表单提交数据 //判断输入是否为空 if ( e . detail . value . inputname == "" | e . detail . value . inputpass == "" ) { wx . showToast ( { icon : 'none' , title : '请输入有效值' , } ) } else { const db = wx . cloud . database ( ) var username = e . detail . value . inputname var password = e . detail . value . inputpass db . collection ( 'user_info' ) . where ( { //查询用户信息数据库 username : username , password : password } ) . get ( { success : res => { if ( res .

uni app 零基础小白到项目实战-1

阅读更多关于 uni app 零基础小白到项目实战-1

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> uni-app是一个使用vue.js开发跨平台应用的前端框架。开发者通过编写vue.js代码，uni-app将其编译到Ios,android,微信小程序等多个平台，保证其正确并达到优秀体验。 Uni-app继承自vue.js，提供了完整的vue.js开发体验。 uni-app组件规范和扩展api与微信小程序基本相同。有一定vue.js和微信小程序开发经验的开发者可快速上手uni-app，开发出兼容多端的应用。 uni-app提供了条件编译优化 pages.json: 配置页面路由，导航条，选项卡等页面类信息。 manifest.json: 配置应用名称，appid，Logo，版本 app.vue 应用配置，用来配置app全局样式以及监听应用的生命周期。 main.js: vue初始化入口文件 static目录：存放应用引用静态资源 pages目录：业务页面文件存放目录 components目录：组件文件存放目录 uni-app页面样式与布局重要说明请删除app.vue中的全局样式，view{display:flex;} 在需要flex的时候使用flex即可。尺寸单位 uni-app框架目前仅支持长度单位px和%，与传统web页面不同，px是相对于基准宽度的单位，已经适配了移动端屏幕，其原理类似于rem

订阅 WeUI