在移动前端上避免使用100vh单位

在移动前端上避免使用100vh单位
100vh在移动浏览器中以微妙但基本的方式被破坏,这使其几乎无用。 最好避免100vh ,而是依靠javascript设置高度以获得完整的视口体验。

手机端页面在项目中遇到的一些问题及解决办法

手机端页面在项目中遇到的一些问题及解决办法
解决页面使用overflow: scroll在iOS上滑动卡顿的问题?ios页面橡皮弹回效果遮挡页面选项卡?Ios键盘换行变为搜索?

移动前端自适应适配方法总结

所谓前端适配,就是为了让移动设计稿在大部分的移动设备上看起来有一致的展示效果,目前比较流行的方法有两种。一种是强制meta viewport宽度为设计稿宽度,一种是使用rem自适应布局的flexible.js。

移动设备强制横屏显示以及兼容问题

移动设备强制横屏显示以及兼容问题
在移动设备中,有一些H5由于需要用户横屏查看的,常见的做法是检测屏幕方向,然后提示用户旋转屏幕查看,这样子虽然可以,但如果用户是固定了屏幕的,那么体验就比较差了,本文分享让页面一进来就强制横屏方向显示的代码及遇到的问题解决方法。

requestAnimationFrame详解以及无线页面优化

requestAnimationFrame详解以及无线页面优化
window.requestAnimationFrame() 方法告诉浏览器您希望执行动画并请求浏览器调用指定的函数在下一次重绘之前更新动画。该方法使用一个回调函数作为参数,这个回调函数会在浏览器重绘之前调用。

移动端开发需要加的meta

移动端开发需要加的meta和常用的CSS3媒体查询样式,移动开发中头部要加的一些常用meta。

认识视口单位vm、vh在网页中的排版应用

认识视口单位vm、vh在网页中的排版应用
由于视口单位涉及到计算,有一段时间我是抵制在工作使用视口单位。但就在上周,我克服了心中的抵制情绪,开始去了解视口单位在网页排版中的使用。在深入介绍视口单位以及其在网页排版中的工作原理时,先了解下有哪些常见的视口单位。

使用VH和VW实现真正的流体排版

使用VH和VW实现真正的流体排版
视口(viewport)单位,使流体排版在页面上应用变为可能。视口单位是根据浏览器的视口尺寸的百分比来定义的。举个例子,1视口宽度(vw)等于视口宽度的1%,它不同于百分比的地方是,它的宽度是依赖于视口的宽度的,而百分比是元素的祖先元素来决定的。

移动web缓存介绍

移动web缓存介绍
H5,即 HTML5,是新一代的 HTML 标准,加入很多新的特性。离线存储(也可称为缓存机制)是其中一个非常重要的特性。H5 引入的离线存储,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问。

移动端 Touch 事件介绍

本文主要介绍 TouchEvent 相关的一些对象与属性如 Touch, TouchList, touhces, targetTouches 等,以及使用的注意点和误区。 触摸事件有以下几种类型:touchstart,touchmove,t ...