1. $(window).bind("orientationchange", function (event) {
  2. if (event.orientation) {
  3. //portrait 竖屏 landscape 横屏
  4. if (event.orientation == 'portrait') {
  5. if (browser.versions.android) {
  6. //安卓手机触发时间晚,设定一个延迟
  7. setTimeout(function () {
  8.  
  9. //需要变更的元素长宽
  10. $("#contents").css("height", parseInt($(window).height() - 44));
  11. $("#joinclub").css("width", $(window).width());
  12. }, 300);
  13. }
  14. else {
  15. $("#contents").css("height", parseInt($(window).height() - 44));
  16. $("#joinclub").css("width", $(window).width());
  17. }
  18. }
  19. else if (event.orientation == 'landscape') {
  20. if (browser.versions.android) {
  21. setTimeout(function () {
  22. $("#contents").css("height", parseInt($(window).height() - 44));
  23. $("#joinclub").css("width", $(window).width());
  24. }, 300);
  25. }
  26. else {
  27. $("#contents").css("height", parseInt($(window).height() - 44));
  28. $("#joinclub").css("width", $(window).width());
  29. }
  30. }
  31. }
  32. });

  

web app 页面旋转整体样式问题的更多相关文章

  1. web app页面要求

    代码: <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum- ...

  2. Web App 响应式页面制作 笔记整理

    一.移动端种类.分辨率大小 说明: 以主流的iPad.iPhone为例. 工具: Resizer官网: Resizer 用法: 将通栏处写有 “Click or Bookmark”的蓝色按钮拖拽至标签 ...

  3. 为Go Web App 创建一个主页面

    原文地址    大多数web app都有一个相同的布局.这个布局可能包含一个header或者footer,甚至可能包含一个导航菜单.Go的标准库提供一个简单的方式来创建这些基本元素,通过被不同的页面重 ...

  4. 提升现代web app中页面性能

    提升现代web app的中的页面性能 前言,本文翻译自https://docs.google.com/presentation/d/1hBIb0CshY9DlM1fkxSLXVSW3Srg3CxaxA ...

  5. html5文章 -- 使用 jQuery Mobile 与 HTML5 开发 Web App ——开发原则 | Kayo's Melody

    最近专注研究 jQuery Mobile —— 一款很方便就可以把 Web App 包装成适合 Android 与 iPhone 等触屏移动设备的 Javascript 库,结合 jQuery Mob ...

  6. 必胜宅急送Web app设计背后的思考

    O2O模式是餐饮业在移动消费趋势下主动拥抱互联网的方向,迎合餐饮消费者从以往经验判断为主转变为依靠移动设备.lbs.社交网络进行立体决策的过程.继App客户端之后,手机web app也逐渐成为O2O中 ...

  7. 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理

    [微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...

  8. Progressive Web App

    下一代 Web 应用? 近年来,Web 应用在整个软件与互联网行业承载的责任越来越重,软件复杂度和维护成本越来越高,Web 技术,尤其是 Web 客户端技术,迎来了爆发式的发展. 包括但不限于基于 N ...

  9. web app开发技巧总结 (share)

    (转自http://hi.baidu.com/kuntakinte/item/ca92d6e5edae9fc0bbf37d08) 自Iphone和Android这两个牛逼的手机操作系统发布以来,在互联 ...

随机推荐

  1. WebSocket 是什么原理?为什么可以实现持久连接

    你可以把 WebSocket 看成是 HTTP 协议为了支持长连接所打的一个大补丁,它和 HTTP 有一些共性,是为了解决 HTTP 本身无法解决的某些问题而做出的一个改良设计.在以前 HTTP 协议 ...

  2. Linux进程间通信(IPC)

    序言 linux下的进程通信手段基本上是从Unix平台上的进程通信手段继承而来的. 而对Unix发展做出重大贡献的两大主力AT&T的贝尔实验室及BSD(加州大学伯克利分校的伯克利软件发布中心) ...

  3. Linux Tomcat必须知道的命令

    查看java相关的进程号:ps -ef|grep java 杀死进程:kill -s 9(进程号,9优先级最高) 预启动tomcat: ./catalina.sh run (可查看启动状态) 启动to ...

  4. EXT实现表格斑马线

    Ext.grid.GridPanel 单双行颜色样式(斑马线)2014-04-03 11:25 1078人阅读 评论(0) 收藏 举报分类:ExtJs(36)Ext.grid.GridPanel st ...

  5. PenetrationTest

    一.渗透测试是什么 渗透测试(PenetrationTest)是对安全情况最客观.最直接的评估方式,主要是模拟黑客的攻击方法对系统和网络进行非破坏性质的攻击性测试,在保证整个渗透测试过程都在可以控制和 ...

  6. 修改linux默认jdk版本

    当你已经成功把jdk1.6.0_03 安装到 /usr/java,并且配置好了系统环境变量 执行 # java -version 时就是 显示jdk1.4.3,是因为你的linux系统有默认的jdk; ...

  7. mac 下tomcat启动报错 unknown host

    解决方法:sudo scutil --set HostName localhost

  8. Case 架构的实际应用-1

    We use testlink to manage cases, and the frame is below: Project Name -All Features(Modules) -Featur ...

  9. 文件夹工具类 - FolderUtils

    文件夹工具类,提供创建完整路径的方法. 源码如下:(点击下载 -FolderUtils.java .commons-io-2.4.jar ) import java.io.File; import o ...

  10. [转载-仅为个人学习所用]Stack Menu

    http://code4app.com/ios/51fa7d7e6803fa2710000006 我有个很牛的同学朋友同事舍友···他技术牛人,写的博客都是原创,粉丝无数,说实话我真的挺妒嫉的,试过为 ...