Mobile Web开发处理设备的横竖屏

【Mobile Web开发处理设备的横竖屏】的更多相关文章

Mobile Web开发处理设备的横竖屏

为了应对移动设备屏幕的碎片化,我们在开发Mobile Web应用时,一个最佳实践就是采用流式布局,保证最大可能地利用有限的屏幕空间.由于屏幕存在着方向性,用户在切换了屏幕的方向后,有些设计上或实现上的问题就会凸显——我们至少需要处理一下当前显示元素的宽度的适配(当然,要做的可能不仅仅是这个).很多时候,我们需要为不同的屏幕方向来设计对应的应用显示模式,这个时候,实时地获知设备的模竖屏状态就显得极为重要. window.orientation属性与onorientationchange事件 win…

开发库比较(3) - Mobile Web 开发 - Sencha, jquerymobiel, phonejs, jqtouch, jqmobi

我们一直坚信Html/css在界面上最终会一统江湖,因为在众多的界面编写中,qt,gtk,wpf,win form, wxwidgets等等,只有Html/CSS是真正拥有统一标准,只有这个有潜力作用一次编写,到处长得一样. 回归正题,我们要编写android和ios的手机客户端程序,要使用定制界面,如果使用原生的Java和objective-c开发,要开发两套界面,并且更要维护两套代码,考虑开发成本太高.而web application+phonegap更适合我们的情况. 然后就有以下框架:我…

iOS开发之判断横竖屏切换

/** * 当屏幕即将旋转的时候调用 * * @param toInterfaceOrientation 旋转完毕后的最终方向 * @param duration 旋转动画所花费的时间 */ - (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration { if (UIInterfaceOrientation…

前端小记4——高性能mobile web开发

1.高性能CSS3动画与PC端场景需要相比,移动web端需要考虑的因素也相对复杂,重点考虑:流量.功耗与流畅度.在pc端上考虑更多的是流畅度,而mobile web中需要考虑网络流量的使用和耗电情况. 关于流畅度,在前端动画中主要有两种:JS动画与CSS3动画. JS动画是通过JS动态改写样式实现动画能力的一种方案,在PC端兼容低端浏览器中不失为一种推荐方案. 而在移动端,我们选择性能更优浏览器原生实现方案:CSS3动画.然而,CSS3动画在移动多终端设备场景下,相比PC会面对更多的性能问题,…

（一〇八）iPad开发之横竖屏适配

在iPad开发中,横竖屏的视图常常是不同的,例如侧边栏Dock,在横屏时用于屏幕较宽,可以展示足够多的内容,每个按钮都可以展示出标题:而竖屏时Dock应该比较窄,只显示图标不现实按钮标题. iPad比较重要的知识是不同类型设备的宽高在以点为单位的图形坐标系下固定为768x1024,因此常常利用此值来判断横竖屏. 768.1024.横竖屏判断很常用,可以定义一个公共的常量文件来放这些内容. [常量和宏的定义] ①在.m文件中,定义变量,加上const,注意指针(例如NSString*)使用的是常量…

转载：移动web开发规范

本文来源:http://blog.csdn.net/joueu/article/details/44329825 以下是规范建议,均是日常在开发当中的的一些经验,仅供参考. 移动web开发规范一.头部声明 1.其中width=device-width就是说把页面宽度设置成和屏幕宽度一样 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 2.首先我们来看看webki…

移动Web开发实践

移动设备的高速发展给用户带来了非常大的便利.用户使用Android.iPhone和其他移动设备非常easy接入互联网. 移动设备对网页的性能要求比較高.以下就说说Mobile Web开发的一些心得. Viewport 当你用iPhone訪问一个没有面向移动设备优化过的站点时(最好选取960px宽度的站点).你会发现iPhone上面刚好能够把整个页面显示出来,可是页面被缩小了许多.字体很小.这其实是Sarari默认把自己当成980px宽度来处理的,而全部iPhone(竖屏)的真实宽度为320px,…