09 2015 档案

移动端重构系列7——滚动
摘要:移动端重构系列-mobile本系列文章,如果没有特别说明,兼容安卓4.0.4+原生滚动原生滚动的属性为:-webkit-overflow-scrolling:touch;,如果是走高富帅的苹果路线,是没问题的,谁让这是人家亲生的呢;如果是安卓的话,我真不知道是支持还是不支持,说不支持吧好像有点缓动效... 阅读全文

posted @ 2015-09-30 16:13 商清逸 阅读(162) 评论(0) 推荐(0)

移动端重构系列6——图标
摘要:移动端重构系列-mobile本系列文章,如果没有特别说明,兼容安卓4.0.4+这里我们把图标分为三种:背景图片,直接绘制,@font-face。如无特殊情况,图标的标签采用i标签背景图片首先我们会选择sprite形式,把所有的图标都放在一个大图中,然后考虑到retina屏,所以我们的图标应该设计为实... 阅读全文

posted @ 2015-09-30 14:20 商清逸 阅读(194) 评论(0) 推荐(0)

移动端重构系列5——切入切出动画
摘要:移动端重构系列-mobile本系列文章,如果没有特别说明,兼容安卓4.0.4+因为后面的几篇文章都需要用到切入切出动画什么的,所以先把这个说下。为了简单起见,我们这里只讨论translate偏移动画(translate比起绝对定位的top/left/right/bottom要高效),而如其他的旋转缩... 阅读全文

posted @ 2015-09-30 14:18 商清逸 阅读(203) 评论(0) 推荐(0)

移动端重构系列4——等分,居中等
摘要:移动端重构系列-mobile本系列文章,如果没有特别说明,兼容安卓4.0.4+之所以把本篇单独拿出来讲解,是因为这些在移动端使用的频率太高了,然后实现方法也不尽相同,而这里主要说下如何用flex和translate来实现。注:代码部分涉及到sass的mixin部分,在sandal的mixin文件中均... 阅读全文

posted @ 2015-09-30 14:17 商清逸 阅读(308) 评论(0) 推荐(0)

移动端重构系列3——重置样式
摘要:移动端重构系列-mobile本系列文章,如果没有特别说明,兼容安卓4.0.4+,测试demo基于Normalize.css,根据目前我们大家的使用习惯进行了一些清零及移动端的特点添加一些基础样式。html { font-family: "Helvetica Neue", Helvetica, STH... 阅读全文

posted @ 2015-09-30 14:08 商清逸 阅读(180) 评论(0) 推荐(0)

移动端重构系列2——整体布局(转载)
摘要:本系列文章,如果没有特别说明,兼容安卓4.0.4+,测试demo移动端和pc端一样整体上布局也可以分为上中下三部分,如图:一般来说,header和footer部分都为fixed定位,中间的内容区域可滚动。fixed布局常规的结构如下: ...因为移动端单页面特性,所以每个pag... 阅读全文

posted @ 2015-09-30 13:46 商清逸 阅读(220) 评论(0) 推荐(0)

移动端重构系列1——新建空白页面(转载)
摘要:移动端重构系列-mobile本系列文章,如果没有特别说明,兼容安卓4.0.4+,测试demohtml5文档申明 Documentmeta标签viewport视图窗口,移动端特属的标签。一般使用下面这段代码即可:上面的代码依次表示设置宽度为设备的宽度,默认不缩放,不允许用户缩放(即禁止缩... 阅读全文

posted @ 2015-09-30 10:28 商清逸 阅读(188) 评论(0) 推荐(0)

八种创建等高列布局(转载)
摘要:高度相等列在Web页面设计中永远是一个网页设计师的需求。如果所有列都有相同的背景色,高度相等还是不相等都无关紧要,因为你只要在这些列的父元素中设置一个背景色就可以了。但是,如果一个或多个列需要单独设置自己的背景色,那么它的视觉完整性的设计就显得非常重要了。大家都知道当初Table实现等高列布局是多么... 阅读全文

posted @ 2015-09-29 18:03 商清逸 阅读(263) 评论(0) 推荐(0)

一个完整的Flexbox指南(转载)
摘要:本文由大漠根据Chris Coyier的《A Complete Guide to Flexbox》所译,整个译文带有我们自己的理解与思想,如果译得不好或不对之处还请同行朋友指点。如需转载此译文,需注明英文出处:http://css-tricks.com/snippets/css/a-guide-to... 阅读全文

posted @ 2015-09-29 18:01 商清逸 阅读(273) 评论(0) 推荐(0)

等高列布局、水平垂直居中与置顶页脚(转载)
摘要:等高列布局在《八种创建等高列布局》一文中详细介绍了八种创建等高列布局的不同方法。可以说这些方法足以满足你的业务需求,当然其中有一些方法略为繁琐,也有时转得人头晕。在今天这种技术环境之下,如果的业务对IE低版本依赖性不是非常强的情况之下,可以考虑一些新的方法来实现。接下来我与大家一起探讨几种新方法实现... 阅读全文

posted @ 2015-09-29 16:41 商清逸 阅读(312) 评论(0) 推荐(0)

Block formatting context & Inline formatting context(BFC&IFC)的区别(转载)
摘要:何为BFC与IFCbfc与ifc是针对页面正常流的两种环境,块级元素处于bfc环境中,行内元素处于ifc环境中。元素是块级元素or行内元素由其display属性决定:block, table, flex, grid, list-item 为块级inline, inline-block, inline... 阅读全文

posted @ 2015-09-29 16:11 商清逸 阅读(323) 评论(0) 推荐(0)

[转载]网页动画的十二原则
摘要:CSS的Animation是一个很有意思的东西,也是CSS中较为复杂也难设计的一部分。熟不知在Web的动画设计中有12个关键原则。在Animation 101将这十二原则剖析出来。今天特意转载@刘英滕翻译《Animation Principles for the Web》的中文。作为前端的设计师和工... 阅读全文

posted @ 2015-09-29 14:06 商清逸 阅读(185) 评论(0) 推荐(0)

前端精选文摘:css之GFC 神奇背后的原理(整理)
摘要:CSS3 Grid LayoutWeb页面的布局,我们常见的主要有“浮动布局(float)”、“定位布局(position)”、“行内块布局(inline-block)”、“CSS3的多栏布局(Columns)”、“伸缩布局(Flexbox)”以及“网格布局(Grids)”等,在众多布局方法中,大家... 阅读全文

posted @ 2015-09-29 14:03 商清逸 阅读(573) 评论(0) 推荐(0)

css3之BFC、IFC、GFC和FFC
摘要:CSS2.1中只有BFC和IFC, CSS3中才有GFC和FFC。What's FC?一定不是KFC,FC的全称是:Formatting Contexts,是W3C CSS2.1规范中的一个概念。它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元素将如何定位,以及和其他元素的关系和相互作用... 阅读全文

posted @ 2015-09-29 09:12 商清逸 阅读(4602) 评论(0) 推荐(1)

屏幕旋转问题小结
摘要:一、竖屏转横屏问题二、监听屏幕旋转4. 屏幕旋转事件:onorientationchange添加屏幕旋转事件侦听,可随时发现屏幕旋转状态(左旋、右旋还是没旋)。例子:// 判断屏幕是否旋转function orientationChange() { switch(window.orientatio... 阅读全文

posted @ 2015-09-28 17:26 商清逸 阅读(176) 评论(0) 推荐(0)

前端精选文摘:css之BFC 神奇背后的原理(转载)
摘要:一、BFC是什么? 在解释 BFC 是什么之前,需要先介绍 Box、Formatting Context的概念。 Box: CSS布局的基本单位 Box 是 CSS 布局的对象和基本单位, 直观点来说,就是一个页面是由很多个 Box 组成的。元素的类型和 display 属性,决定了这个 Bo... 阅读全文

posted @ 2015-09-28 15:22 商清逸 阅读(199) 评论(0) 推荐(0)

div+css布局自适应小结
摘要:一、两栏布局(左定宽,右自动)1. float + margin即固定宽度元素设置float属性为left,自适应元素设置margin属性,margin-left应>=定宽元素宽度。举例: 两栏布局-左定宽,右自动 我是左栏 ... 阅读全文

posted @ 2015-09-28 14:14 商清逸 阅读(286) 评论(1) 推荐(0)

AngularJS
摘要:Angular是一个js库,它可以通过js来扩展html元素,他可以通过指令(AngularJS 指令是以ng作为前缀的 HTML 属性)扩展html,通过表达式添加数据绑定html。AngularJS 通过ng-directives扩展了 HTML。ng-app指令定义一个 AngularJS 应... 阅读全文

posted @ 2015-09-28 13:49 商清逸 阅读(155) 评论(0) 推荐(0)

css3动画机制原理和实战
摘要:http://www.w3cplus.com/css3/CSS3-animation.html http://www.i7758.com/archives/1585.html http://segmentfault.com/q/1010000000645415 css3动画讨论 阅读全文

posted @ 2015-09-25 17:48 商清逸 阅读(2682) 评论(0) 推荐(0)

css3背景渐变以及图片混合渲染模式(二)
摘要:http://avnpc.com/pages/photoshop-layer-blending-algorithmhttp://www.html5cn.org/forum.php?mod=viewthread&tid=83244 阅读全文

posted @ 2015-09-24 17:17 商清逸 阅读(197) 评论(0) 推荐(0)

css3背景渐变以及图片混合渲染模式(一)
摘要:一、CSS3渐变(Gradients):CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡。以前,你必须使用图像来实现这些效果。但是,通过使用 CSS3 渐变(gradients),你可以减少下载的事件和宽带的使用。此外,渐变效果的元素在放大时看起来效果更好,因为渐... 阅读全文

posted @ 2015-09-23 16:42 商清逸 阅读(950) 评论(0) 推荐(0)

JS判断客户端是否是iOS或者Android或者ipad(三)
摘要:* * @function: 判断浏览器类型是否是Safari、Firefox、ie、chrome浏览器* @return: true或false* */function isSafari(){var userAgent = navigator.userAgent.toLowerCase();if(... 阅读全文

posted @ 2015-09-23 16:33 商清逸 阅读(413) 评论(0) 推荐(0)

JS判断客户端是否是iOS或者Android或者ipad(二)
摘要:js判断客户端是IPAD和iphone多了就不说了,直接上代码:12345678910111213141516171819202122function checkIsIphoneIpad(){ var pda_user_agent_list = new Array("iPhone", "iPod",... 阅读全文

posted @ 2015-09-23 13:26 商清逸 阅读(2344) 评论(1) 推荐(1)

JS判断客户端是否是iOS或者Android或者ipad(一)
摘要:通过判断浏览器的userAgent,用正则来判断是否是ios和Android客户端。代码如下下面一个比较全面的浏览器检查函数,提供更多的检查内容,你可以检查是否是移动端(Mobile)、ipad、iphone、微信、QQ等。第一种:来自http://blog.baiwand.com/?post=17... 阅读全文

posted @ 2015-09-23 10:30 商清逸 阅读(308) 评论(0) 推荐(0)

js浏览器下载总结(ios、and、微信、qq)
摘要:前段时间做了个项目,里面关于手机移动端下载的问题开始是判断微信、ios和android系统的下载因为微信屏蔽点击事件和链接的缘故,需要通过打开新页面来进行下载ios和android的下载分别为不同的问题。代码如下:然后问题解决了,你觉得万事大吉了,真是太天真了!!!!上线以后,问题又来了。因为ipa... 阅读全文

posted @ 2015-09-23 10:23 商清逸 阅读(1070) 评论(0) 推荐(0)

js浏览器问题
摘要:前段时间做了个项目,里面关于手机移动端下载的问题开始是判断微信、ios和android系统的下载因为微信屏蔽点击事件和链接的缘故,需要通过打开新页面来进行下载ios和android的下载分别为不同的问题。代码如下:然后问题解决了,你觉得万事大吉了,真是太天真了!!!!上线以后,问题又来了。因为ipa... 阅读全文

posted @ 2015-09-23 10:21 商清逸 阅读(364) 评论(0) 推荐(0)

京东首页闪光滑动效果小记(转载)
摘要:http://www.w3cfuns.com/blog-5473326-5409149.html 阅读全文

posted @ 2015-09-22 16:37 商清逸 阅读(206) 评论(0) 推荐(0)

jQuery $.ajax跨域-JSONP获取JSON数据(转载)
摘要:来源:http://justcoding.iteye.com/blog/1366102 阅读全文

posted @ 2015-09-22 13:49 商清逸 阅读(386) 评论(0) 推荐(0)

柒、jq控制页面
摘要:请求 阅读全文

posted @ 2015-09-22 13:46 商清逸 阅读(115) 评论(0) 推荐(0)

关于css3背景图片渐变的规则
摘要:1. Webkit引擎的CSS3径向渐变语法 Webkit引擎下的老版本语法:-webkit-gradient([],[ || ,]?[ ||,]?,[,]*); //Safari Chrome这两款浏览器支持的版本,浏览器Chrome4-9 和Safari4-5版本支持 Webkit引... 阅读全文

posted @ 2015-09-22 10:56 商清逸 阅读(889) 评论(0) 推荐(0)

div纵向居中的方法(转载)
摘要:方法一这个方法把一些 div 的显示方式设置为表格,因此我们可以使用表格的 vertical-align property 属性。 Content goes here #wrapper {display:table;}#cell {display:table-cell; ... 阅读全文

posted @ 2015-09-22 10:54 商清逸 阅读(745) 评论(0) 推荐(0)

陆、jq基础语法
摘要:一、概述:更加方便的处理html文档、events事件、动画效果和ajax交互等。1、jq主要功能:(1)访问页面框架的局部。(2)修改页面表现(3)更改页面的内容(4)响应事件(5)为页面添加动画(6)与服务器异步交互(7)简化常用的js操作2、jq的优势:a、jQuery实现脚本与页面的分离在H... 阅读全文

posted @ 2015-09-22 10:47 商清逸 阅读(263) 评论(0) 推荐(0)

JS自定义功能函数实现动态添加网址参数修改网址参数值
摘要:无论是前端开发还是后台设计,很多时候开发人员都需要获取当前或目标网址的相关信息。这个已有现成的内置对象属性可以直接调用了(下面是获取当前页面的参考代码) 复制代码 代码如下: 但有时候我们需要改变目前网址的参数/参数值,这时候大家会如何处理呢?一般应该都会先通过获取所有参数的信息,然后再根据实际... 阅读全文

posted @ 2015-09-21 18:05 商清逸 阅读(372) 评论(0) 推荐(0)

伍、ajax
摘要:一、ajax的概念通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等... 阅读全文

posted @ 2015-09-21 17:59 商清逸 阅读(163) 评论(0) 推荐(0)

js的调试和优化
摘要:一、常见的错误和异常1、拼写错误拼写错误,可以有代码的高亮来发现。2、访问不存在的变量3、括号不匹配养成规范的编写习惯,适当应用Tab、空行等。4、字符串和变量链接错误采用多加括号来进行分离的办法解决。5、等号和赋值混淆二、错误处理1、用alert()和document()方法监视变量赋值2、用on... 阅读全文

posted @ 2015-09-21 15:45 商清逸 阅读(166) 评论(0) 推荐(0)

js语法之条件语句
摘要:一、比较操作符比较操作符包括:等于(==)、大于(>)、大于等于(>=)、小于(<)、小于等于(<=)。 阅读全文

posted @ 2015-09-21 15:23 商清逸 阅读(163) 评论(0) 推荐(0)

inline-block 前世今生
摘要:http://www.iyunlu.com/view/css-xhtml/64.html(转) 阅读全文

posted @ 2015-09-18 10:44 商清逸 阅读(216) 评论(0) 推荐(0)

js动态引入的四种方式
摘要:http://blog.csdn.net/victormokai/article/details/8978747转载 阅读全文

posted @ 2015-09-17 17:22 商清逸 阅读(1164) 评论(0) 推荐(0)

canvas图片滚动
摘要:HTML5 Images Slider 阅读全文

posted @ 2015-09-17 15:46 商清逸 阅读(356) 评论(0) 推荐(0)

如何搞定界面设计之构图篇(转)
摘要:人家设计得真好!”可是好在什么地方呢,却说不出来。这是阻挡你成为优秀设计师的一大障碍。设计是我们的本行,不会用设计语言来解构画面,是说不过去的。移动互联网设计发展到今天,有很多传统的设计规律可以遵循,也提出了新的挑战。因为手持设备屏幕较小,如何在有限的页面内呈现或引导有效信息,又不显得杂乱臃肿,考验... 阅读全文

posted @ 2015-09-17 15:05 商清逸 阅读(334) 评论(0) 推荐(0)

PT与PX区别
摘要:字体大小的设置单位,常用的有2种:px、pt。这两个有什么区别呢?先搞清基本概念:px就是表示pixel,像素,是屏幕上显示数据的最基本的点;pt就是point,是印刷行业常用单位,等于1/72英寸。这样很明白,px是一个点,它不是自然界的长度单位,谁能说出一个“点”有多长多大么?可以画的很小,也可... 阅读全文

posted @ 2015-09-17 14:51 商清逸 阅读(18696) 评论(1) 推荐(1)

移动前端系列–移动端页面坑与排坑技巧
摘要:移动端页面在不同设备、不同操作系统 、不同运行环境下都可能造成各种各样的没有碰到过的的坑,相比曾经的IE6坑多了。 阅读全文

posted @ 2015-09-17 14:33 商清逸 阅读(468) 评论(0) 推荐(0)

安卓、safari和微信各个浏览器的设计标准
摘要:几乎市面上所有的浏览器标准 阅读全文

posted @ 2015-09-17 10:34 商清逸 阅读(257) 评论(0) 推荐(0)

肆、js的DOM模型
摘要:一、网页中的dom模型框架1、dom中的3中节点:元素节点、文本节点、属性节点a.元素节点:html中的各种标签就是各个元素节点,元素节点可以包含其他元素,只有html根节点例外。b.文本节点:标签里面的文本内容就是文本节点,可以被包含在元素节点的内部。c.属性节点:页面元素的属性,属性节点总是被包... 阅读全文

posted @ 2015-09-16 14:56 商清逸 阅读(152) 评论(0) 推荐(0)

js表格隔行换色和hover效果
摘要:姓名授权级别经销商手机号谈重海一级代理156230152416数据数据数据数据数据数据数据数据数据数据数据数据.table-tr-title{ font-weight:bold;height: 26px;font-size: 16px; font-family:"微软雅黑"; line-height... 阅读全文

posted @ 2015-09-16 11:51 商清逸 阅读(220) 评论(0) 推荐(0)

制作页面小结
摘要:1、微信问题:因为微信的比网页多了一个头部,所以微信页面的高比其他的高多了80左右的像素。所以做微信的时候要考虑这点,另外微信屏蔽点击效果,所以做的时候,不要直接点击打开页面,尽量另开一个页面。 阅读全文

posted @ 2015-09-15 16:16 商清逸 阅读(142) 评论(0) 推荐(0)

叁、js中的css
摘要:一、子选择器:用来选择一个父元素直接的子元素,不包括子元素的子元素,它的符号为“>” 注:ie6不支持子代选择器。CSS的子选择器 isaac's Picasa CSS1 CSS2 CSS3 二、属性选择器... 阅读全文

posted @ 2015-09-15 13:57 商清逸 阅读(158) 评论(0) 推荐(0)

贰、js的基础(三)数组
摘要:JS中数组的操作1、数组的创建var arrayObj = new Array(); //创建一个数组var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度var arrayObj = new Array([element0[, elem... 阅读全文

posted @ 2015-09-15 11:56 商清逸 阅读(190) 评论(0) 推荐(0)

贰、js的基础(四)
摘要:一、条件语句 阅读全文

posted @ 2015-09-15 11:55 商清逸 阅读(156) 评论(0) 推荐(0)

贰、js的基础(二)类型转换
摘要:JS 数据类型转换方法主要有三种转换函数、强制类型转换、利用js变量弱类型转换。1. 转换函数:js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数,后者把值转换成浮点数。只有对String类型调用这些方法,这两个函数才能正确运行;对其他类型返回的都是NaN(No... 阅读全文

posted @ 2015-09-15 11:54 商清逸 阅读(190) 评论(0) 推荐(0)

贰、js的基础(一)
摘要:1、js的语法a.区分大小写b.弱类型变量:变量无特定类型c.每行结尾的分号可有可无d.括号用于代码块e.注释的方法与c语言和java相同2、变量注意事项:a.通过关键字var来声明。b.可以声明多个变量。c.同一个变量中储存不同的数据类型(最好是同一个变量只存储一种数据类型)d.变量名称遵循的规则... 阅读全文

posted @ 2015-09-14 17:06 商清逸

ajax的异步请求小结
摘要:如何判断是使用json还是jsp的数据传输:json字符串可以使用js,jquery,ajax,java这几种技术,页面为jsp页面,json数据为java后台传递来。1、同步请求可以从因特网请求数据,一旦发送同步请求,程序将停止用户交互,直至服务器返回数据完成,才可以进行下一步操作,2、异步请求不... 阅读全文

posted @ 2015-09-14 13:32 商清逸 阅读(190) 评论(0) 推荐(0)

壹、js的概述
摘要:一、js的起源1992年的时候,一家名为Nomnas的公司开发出了c减减的嵌入式脚本语言;然后利用分享的方式,扩大其市场。之后,Netscape为了扩展浏览器的功能,开发了一个名为LiveScript的脚本语言,并与1995年11月末与Sun公司联合宣布改其名为Javascript。1997年,ja... 阅读全文

posted @ 2015-09-14 10:40 商清逸 阅读(468) 评论(0) 推荐(0)

sass的用法小结(四)进阶篇
摘要:Sass 的数据类型Sass 既然有了类似编程语言的功能,自然也就有了简单的数据类型。这里简单的介绍一些 Sass 中的数据类型,因为在后面的讨论中要用到有关的内容。Sass 中主要有六种数据类型:数字型 (e.g. 1.2, 13, 10px)文本型,单引号、双引号或者不加都可以 (e.g. “f... 阅读全文

posted @ 2015-09-09 16:44 商清逸 阅读(522) 评论(0) 推荐(0)

sass的用法小结(三)
摘要:5. 混合器;如果你的整个网站中有几处小小的样式类似(例如一致的颜色和字体),那么使用变量来统一处理这种情况是非常不错的选择。但是当你的样式变得越来越复杂,你需要大段大段的重用样式的代码,独立的变量就没办法应付这种情况了。你可以通过sass的混合器实现大段样式的重用。混合器使用@mixin标识符定义... 阅读全文

posted @ 2015-09-09 14:59 商清逸 阅读(213) 评论(0) 推荐(0)

sass的用法小结(二)
摘要:3. 导入SASS文件;css有一个特别不常用的特性,即@import规则,它允许在一个css文件中导入其他css文件。然而,后果是只有执行到@import时,浏览器才会去下载其他css文件,这导致页面加载起来特别慢。sass也有一个@import规则,但不同的是,sass的@import规则在生成... 阅读全文

posted @ 2015-09-09 14:33 商清逸 阅读(369) 评论(0) 推荐(0)

sass的用法小结(一)
摘要:1. 使用变量;sass让人们受益的一个重要特性就是它为css引入了变量。你可以把反复使用的css属性值 定义成变量,然后通过变量名来引用它们,而无需重复书写这一属性值。或者,对于仅使用过一 次的属性值,你可以赋予其一个易懂的变量名,让人一眼就知道这个属性值的用途。sass使用$符号来标识变量(老版... 阅读全文

posted @ 2015-09-09 13:50 商清逸 阅读(549) 评论(0) 推荐(0)

css3的小心得
只有注册用户登录后才能阅读该文。

posted @ 2015-09-09 10:11 商清逸 阅读(3) 评论(0) 推荐(0)

H5页面在线制作工具搜集
摘要:1.初页http://chuye.cloud7.com.cn/2.易企秀http://eqxiu.com/#/home3.最酷http://www.zuiku.com/4.易传单http://echuandan.com/5.epub360意派http://www.epub360.com/6.MAKA... 阅读全文

posted @ 2015-09-08 16:41 商清逸 阅读(315) 评论(0) 推荐(0)

H5教程:移动页面性能优化
摘要:随着移动互联网的发展,我们越发要关注移动页面的性能优化,今天跟大家谈谈这方面的事情。首先,为什么要最移动页面进行优化?纵观目前移动网络的现状,移动页面布局越来越复杂,效果越来越炫,直接导致了文件越来越大,下载和运行速度越来越低,而速度低会造成不良影响,据统计:71%的用户期望移动页面跟pc页面一样快... 阅读全文

posted @ 2015-09-08 16:26 商清逸 阅读(456) 评论(0) 推荐(0)

玩转HTML5移动页面(优化篇)
摘要:标签:h5页面优化收藏热门分享网页设计师必备的 酷站收藏网站2013年不容错过的app ui素材40个漂亮的扁平化网页设计欣赏国内网页设计公司网站欣赏55套网页设计常用的psd格式UI主题包素材下载30个“简洁大气国际化”的网页设计欣赏|--(1) 动画雪碧图|--(2) 图片压缩|--(3)多终... 阅读全文

posted @ 2015-09-08 16:25 商清逸 阅读(239) 评论(0) 推荐(0)

玩转HTML5移动页面(动效篇)
摘要:为一名前端,在拿到设计稿时你有两种选择:快速输出静态页面加上高级大气上档次狂拽炫酷屌炸天的动画让页面动起来作为一个有志向的前端,当然是选2啦!可是需求时间又很短很短,怎么办呢? 这次就来谈谈一些动画设计的小技巧,能在你时间不多又没有动画想法的时候瞬间让页面增色不少。同时也会谈及移动端H5页面的优化细... 阅读全文

posted @ 2015-09-08 16:24 商清逸 阅读(1337) 评论(0) 推荐(1)

移动H5前端性能优化指南
摘要:概述1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首屏加载3秒完成或使用Loading4. 基于联通3G网络平均338KB/s(2.71Mb/s),所以首屏资源不应超过1014KB5. Mobile侧因手机配置原因,除加载外渲染速度也... 阅读全文

posted @ 2015-09-08 15:20 商清逸 阅读(126) 评论(0) 推荐(0)

移动端尺寸基础知识
摘要:初涉移动端设计和开发的同学们,基本都会在尺寸问题上纠结好一阵子才能摸到头绪。我也花了很长时间才弄明白,感觉有必要写一篇足够通俗易懂的教程来帮助大家。从原理说起,理清关于尺寸的所有细节。由于是写给初学者的,所以不要嫌我啰嗦。现象首先说现象,大家都知道移动端设备屏幕尺寸非常多,碎片化严重。尤其是Andr... 阅读全文

posted @ 2015-09-08 14:46 商清逸 阅读(158) 评论(0) 推荐(0)

导航