function orientation_change() {
    var viewport = document.querySelector('meta[name="viewport"]');
    if (window.orientation == 0 || window.orientation == 180)
        viewport.setAttribute("content", "width=device-width, maximum-scale=1.0, initial-scale=1.0, user-scalable=no");
    else if (window.orientation == -90 || window.orientation == 90)
        viewport.setAttribute("content", "width=device-height, maximum-scale=1.0, initial-scale=1.0, user-scalable=no");     
} window.onorientationchange = orientation_change;

  

window.orientation
:这个属性给出了当前设备的屏幕方向,0表示竖屏,正负90表示横屏(向左与向右)模式

onorientationchange
: 在每次屏幕方向在横竖屏间切换后,就会触发这个window事件,用法与传统的事件类似

#b{width:300px;height:200px;background:blue;}
@media screen and (orientation:portrait){
#b{background:red;}
}
@media screen and (orientation:landscape){
#b{background:green;}
}

  

防止横竖屏时,iphone自动缩放的一段js代码的更多相关文章

  1. ListView 在设备切换横竖屏时保存状态

    比如listview在设备切换横竖屏时,仍然需要保证position, activity - > onSaveInstanceState  - > restoreInstanceState ...

  2. Android 切横竖屏时走的生命周期方法?222

    第一种情况: 不设置Activity的android:configChanges时,切屏会重新调用各个生命周期,切横屏时会执行一次,切竖屏时会执行两次 第二种情况: 设置Activity的androi ...

  3. 网页调试js时,如何知道某个事件对应哪段js代码?

    有时候我们需要知道某个事件对应的js代码,比如点击一个div元素时,出现下拉框,我想知道这个功能对应的js代码,那就可以按下图操作: 勾选click事件,重新运行,那么就会在每个click事件那里设置 ...

  4. [css][移动设备]禁止横竖屏时内容自动调整

    参考:http://www.kankanews.com/ICkengine/archives/106643.shtml iOS下当竖屏转向横屏的时候,发现内容字体会自动变大,通过各种方法设置字体大小都 ...

  5. 页面加载完后自动执行一个方法的js代码

    1.在body中用onload: <body onload="conver()"> 2.在脚本中用window.onload: <script type=&quo ...

  6. ios5和ios6横竖屏支持及ipad和iphone设备的判断

    ios5和ios6横竖屏支持及ipad和iphone设备的判断 判断是ipad还是iphone设备.此定义在PayViewControllerDemo-Prefix.pch 定义如下: #define ...

  7. Android应用:横竖屏切换总结

    眨眼间,已经到了2016你年春节前,离上一篇博客的时间已经有6个月多,回想起这半年的种种,不得不说,学习和工作实在是太忙了,或许这就是程序员的真实写照吧. 写博客之初,主要的目的还是为了把自己的学习痕 ...

  8. Android横竖屏切换重载问题与小结

    (转自:http://www.cnblogs.com/franksunny/p/3714442.html) (老样子,图片啥的详细文档,可以下载后观看 http://files.cnblogs.com ...

  9. Android 横竖屏切换小结

    (自己体会:每次横竖屏自动切时都会run Activity的onCreate,即相当后重新进入Activity初始化一样:) 转自:http://www.cnblogs.com/franksunny/ ...

随机推荐

  1. 【转】MySQL数据库主从同步管理

    MYSQL主从同步架构是目前使用最多的数据库架构之一,尤其是负载比较大的网站,因此对于主从同步的管理也就显得非常重要,新手往往在出现主从同步错误的时候不知道如何入手,这篇文章就是根据自己的经验来详细叙 ...

  2. [Laravel]配置路由小记

    Laravel:4.2 使用的后台是:laravel-backend php artisan routes 使用这个代码,可以看到显示目前项目的路由器 ,我需要添加功能,我就需要添加路由 /* |-- ...

  3. js动态生成按钮,页面用DIV简单布局2

    对前边不完善的修改 <!DOCTYPE html><html><head><title>test.html</title> <meta ...

  4. JavaScript入门(9)

    一.Math对象 Math对象,提供对数据的数学计算 使用Math的属性和方法,代码如下: <script type="text/javascript"> var my ...

  5. JDK Tools - wsimport: 编译 WSDL 生成 JAX-WS 规范的 Java 类

    wsimport 命令是用来编译 wsdl 生成JAX-WS 规范的 Java 类的工具. 命令格式 wsimport [ options ] wsdl 命令参数 -s directory 指定源文件 ...

  6. Android Activity常用生命周期函数

    在Activity中主要有7个常用的周期函数,他们分别是: (一)onCreate 在Activity对象被第一次创建时调用 注: 从另一个Activity返回到前一个Activity时,不会调用该函 ...

  7. sqlserver 理解文件和文件组

    在sqlserver中,数据库在硬盘的存储方式和普通文件存储一样,仅仅几个文件而已,sqlserver通过管理逻辑上的文件组的方式来管理存储数据的文件, 如图: 文件组管理着磁盘上的文件,而文件中存放 ...

  8. cocos2d-x实战 C++卷 学习笔记--第4章 win32平台下中文乱码问题

    前言: 将GBK编码的字符串转为UTF-8编码.(通俗点说就是解决中文乱码问题) 简要介绍: 在Win32平台下通过 log 输出中文字符时,会出现中文乱码问题.同样的代码在 ios 和 Androi ...

  9. Objective-C 学习笔记(Day 2)

    ------------------------------------------- 如何根据题目准确完整清晰的声明一个类并实现给定的行为 /*  //下面这个程序教大家如何根据题目去声明一个类,并 ...

  10. 理解css 中的position五个属性

    在实际开发页面布局时,运用position,对定位的块级元素的嵌套的效果总是不太理解,这里做了几个测试 一般的在w3c中我们可以很容易的获取定义: static : 默认值.没有定位,元素出现在正常的 ...