最近在写h5的页面,发现有一款框架还不错给大家推荐一下
wui
说一下自己写项目的体会吧,自我感觉wui还不错,能够让自己很快地把页面布局好,而且里面一些js效果也不用自己去手写jQuery代码很方便,下面让我们一起来认识一下wui这个框架吧
1,accordion(折叠面板也就是二级列表)默认收缩,如果展开只需要在包含.W-UI-collapse类的li节点上,增加.W-UI-active类即可,比自己在那写原生方便又快
2,W-UI-popover,弹出框,如果在底部直接在w-ui-popover的类中加.W-UI-popover-bottom、.W-UI-popover-action也可以传入toggle,用户不用关心怎么隐藏的只需要会使用即可
3轮播
其实wui的轮播和bootstrap相似,只是多了前缀w-ui,其他是一样的
4,w-ui滚动事件
- Android平台4.0以下不支持div滚动
- Android平台4.0以上支持div滚动,但不显示滚动条
- 弹出层的div滚动在iOS平台存在事件透传的问题
- W-UI额外提供了区域滚动组件,使用时需要遵循如下DOM结构
<div class="W-UI-scroll-wrapper">
<div class="W-UI-scroll">
<!--这里放置真实显示的DOM内容-->
</div>
</div>
区域滚动默认为absolute W-UI('.W-UI-scroll-wrapper').scroll({
deceleration: 0.0005 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006
}); //如果手动滚动需初始化scroll
最近在写h5的页面,发现有一款框架还不错给大家推荐一下的更多相关文章
- Html+css 练习写页面发现的错误及解决办法。
最近开始模仿写一些静态页面,今天模仿的是中华咨询网.写了一个简单的js(功能:当鼠标hover一级菜单的时候,设置二级菜单为显示,当鼠标hover二级菜单的选项时候,二级菜单不收回.当鼠标移出菜单一级 ...
- Android使用WebView加载H5页面播放视频音频,退出后还在播放问题解决
Android中经常会使用到WebView来加载H5的页面,如果H5页面中有音频或者视频的播放时,还没播放完就退出界面,这个时候会发现音频或者视频还在后台播放,这就有点一脸懵逼了,下面是解决方案: 方 ...
- 利用简洁的图片预加载组件提升h5移动页面的用户体验
在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用户体验.抛开网速的原因,解决这个问题有多方面的思路:最基本的,要从http ...
- 运用预加载提升H5移动页面的用户体验
原文地址:http://www.grycheng.com/?p=2188 在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用 ...
- 利用Django徒手写个静态页面生成工具
每个Geek对折腾自己的博客都有着一份执念 背景介绍 曾经多次在不同的平台写博客,但全部都以失败而告终.去年七月选择微信公众号做为平台开始了又一次的技术分享,庆幸一直坚持到现在,但随着文章发表的越来越 ...
- H5单页面手势滑屏切换原理
H5单页面手势滑屏切换是采用HTML5 触摸事件(Touch) 和 CSS3动画(Transform,Transition)来实现的,效果图如下所示,本文简单说一下其实现原理和主要思路. 1.实现原理 ...
- 快速构建H5单页面切换骨架
在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...
- H5 App页面 绝对定位 软键盘弹出时顶起底部按钮
做H5 App页面时,有时候,按钮可能会放到页面的最底下,这个时候可能会用到绝对定位(position: absolute),但是,当input 输入框被点击时,弹出的软键盘会顶起底部的按钮,就像这样 ...
- 快速构建H5单页面切换应用
在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...
随机推荐
- ==还款-代偿(csv循环自动代偿)
问题: 解决:传递参数错误,上一步就错了 问题:代偿返回这些信息 解决:传递参数错误,应该为${repayWay1},但是一直写的是${repayWay} 问题:如何从csv文件中逐条取项目编号,进行 ...
- UML作业第三次:分析《书店图书销售管理系统,绘制类图
plantuml类图绘制方法的学习: 1.关于类图的学习: 类图显示了系统的静态结构. 类:类图中的主要元素,用矩形表示.矩形的上层表示类名.中层表示属性.下层表示方法. 类之间的关系:关联.依赖.聚 ...
- flask下载文件---文件流
html: <a name="downloadbtn" class="btn btn-success pull-right" href="/do ...
- 微信小程序之图片base64解码
不知道大家在做微信小程序的时候遇到base64解码的问题,我之前在做微信小程序的时候遇到base64解析图片一直有问题,所以在这里把遇到的问题和解决方案在这里记录一下: 在平时的项目中我们是直接用ba ...
- 前端学习历程--vue
---恢复内容开始--- 一.对比其他框架 1.react: 共同点: 使用 Virtual DOM 提供了响应式(Reactive)和组件化(Composable)的视图组件. 将注意力集中保持在核 ...
- ubuntu16.04SSH无法连接
提示错误:server responded "algorithm negotiation failed” 解决办法: 修改ssh的配置文件 /etc/ssh/sshd_config文件 在末 ...
- JVM内存分配与垃圾回收机制管理
项目上线,性能优化有个重要组成就是jvm内存分配和垃圾回收机制的管理配置. 网上随便能搜到相关的具体步骤,以及内存中各种参数对应的意义,不再赘述. 干货就是直接抛出遇到的问题,以及如何解决的,再说说待 ...
- php 中 global 与 $GLOBAL 的区别
很多人都认为global和$GLOBALS[]只是写法上面的差别,其实不然. 根据官方的解释是$GLOBALS['var'] 是外部的全局变量$var本身. global $var 是外部$var的同 ...
- JDK8到JDK12各个版本的重要特性整理
JDK8新特性 1.Lambda表达式 2.函数式编程 3.接口可以添加默认方法和静态方法,也就是定义不需要实现类实现的方法 4.方法引用 5.重复注解,同一个注解可以使用多次 6.引入Optiona ...
- 实际用到的linux小方法
2019.4.261.解决ssh端中文乱码 (1).查看系统(window)的字符集,在命令行界面顶端空白处,右键->属性->选项 底端查看即可. (2).ssh上查看系统支持的字符集 ...