移动端适配方案 flexible.js

前言 移动端适配一直以来都是前端开发中不可或缺的重要组成部分,如果没有了它,那么你做出来的页面极有可能会出现各种意外(写出来的页面与设计稿之间的差别)。所有我们得找到一种相对来说让人比较满意的解决方案,尽可能地让这种“意外”减到最少。没错今天的主角就是它“flexible.js” 。 flexible.js 之旅 flexible.js 的作用就是让你在不同的终端设备之间如鱼得水,如入无人之境。说得那么浮,一点感...

2017
10-09

移动端禁止页面滚动最佳实践

在移动端禁止页面滚动非常的有用,比如在手机端弹出一个弹窗,并带有遮罩,此时你肯定不想让页面可以滚动,毕竟这个遮罩看起来就是这种感觉。下面我们分享一段很实用的代码。代码非常的精简,但恰到好处。 看这里 function preventDefaultHandler(e){ e.preventDefault(); }; document.addEventListener('touchstart', preventDefaultHandler,false);//阻止默认滑动事件(绑定 touchstart) docum...

2017
09-20

移动端非常实用的插件和库

前言 本文主要分享下移动端比较常用的一些插件及库。包括 JS 库和 CSS 库。有了这些插件及库,你也可以轻松做一个移动项目,即使是我们生活中常用的 APP 中的一些效果。 JavaScript 库 有了下面这两个 JavaScript 库,就可以让你的 APP 页面有了质的飞越,效果棒棒不要不要的。 Swiper 官网地址:http://www.swiper.com.cn/ 这个插件可以实现一些导航滑动效果,页面切换效果,甚至是H5 的视觉差效果...

2017
09-17

移动端布局解决方案

前言 在移动 WEB 开发中页面整体框架的布局极其重要,如果你曾经感受过这种痛苦,你就会觉得这篇文章就是为你而写。还是那句话:好的开始,你就成功了一半。我们开始吧? 这也是我自己踩过的一个大坑,在项目中没有做好页面整体框架的规划,也就是整个页面上中下如何布局。对于头部和底部我用了fixed 看起来没有什么毛病,但在实践的使用中就会发现一些让你抓狂的 BUG。在 IOS(如:iphone 5s) 下弹出键...

2017
09-06

关于移动端开发的一些忠告

有好的开始,你就成功的一半,在移动端开发中也不例外。对于一个项目来说框架的选择以及整个项目的结构布局极其重要。下面就分享下自己在平时开发过程中遇到的一些问题,会文会一直更新。 问题一:要不要选择前端 UI 框架 对于这个问题得根据项目的实践情况来进行选择。比如:你的项目采用了敏捷开发,那么框架对于你来说就很有必要了,但是这里有一个问题需要注意,你得提前跟交互同事、UI 同事沟通好。...

2017
09-04

移动端一个像素问题解决方案

前言 移动端(手机等)已成为人们最常用的设备,对于我们这些前端开发人员来说,为了让用户用得爽,看得服务是不够的,因为你有时候还得听一个人的话,他就是传说中的设计师,比如:有时他会跟你讨论这样一个问题,为什么这条线看起来比我原型稿的粗一些,这也太粗了吧?诸如此类的话,让你连反驳的机会都没有,于是也只能暗暗的研究,找解决方法。 起因 这个原因真的不能怪你,但必需要你自己解决。生...

2017
05-21

移动端侧滑导航、侧滑菜单效果

手机端的侧滑导航、侧滑菜单效果极其地常见,这篇文章就是分享侧滑导航的制作过程。首先这是一个基于 jQuery 库的插件,其实不用 jQuery 库也是可以的,并且代码改起来也不能,这里就不作过多的讲解。 首先做这个效果的时候我们得分析下,要实现这个功能,我们需要什么技术。 所需技术 1.滑动,你可以JavaScript 实现 也可以用 CSS3 实现。这里我用CSS3 实现。 2.JavaScript 事件绑定解绑、事件禁用。 从...

2017
03-24