`
kstgjfk403
  • 浏览: 30546 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

手机横竖屏切换时js获取手机有效宽值(兼容苹果和安卓)

阅读更多
// 横屏切换处理(iphone,安卓)
    window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
        // 由于切换时,获取值刚好是切换前的数据,需加上300延时,保证获取的宽度是切换后屏幕的值
        setTimeout(function(){
            var scrollHeight = getMaxValue(document.documentElement.clientHeight, document.body.clientHeight, window.screen.height);
            var scrollwidth = getMaxValue(document.documentElement.clientWidth, document.body.clientWidth, window.screen.width);
            $("#black_marsk").height(scrollHeight);
            $("#black_marsk").width(scrollwidth);
        },300);

    }, false);

//  由于安卓取的宽高有时未必是有效值,所以此处取最大的(用于遮罩层)
function  getMaxValue(num1,num2,num3) {
    var value = 0;
    if( num1 >= num2){
        value = num1;
    }else {
        value = num2;
    }
    if( value< num3){
        value = num3;
    }
    return value;
}
// 默认取页面宽高的值
var height = $("body").height();
var width = $("body").width();
 

 

0
0
分享到:
评论

相关推荐

    iOS Object-c 实现界面横竖屏切换源代码

    本文将深入探讨如何使用Objective-C实现界面的横竖屏切换,并提供相关源代码分析。 首先,理解iOS中的屏幕方向管理是至关重要的。iOS系统提供了两种基本的屏幕方向:portrait(竖屏)和landscape(横屏)。每个应用...

    支持横竖屏切换的视频播放器demo

    在iOS开发中,创建一个支持横竖屏切换的视频播放器是常见的需求,尤其是在开发多媒体应用或者需要视频功能的应用时。这个"支持横竖屏切换的视频播放器demo"就是一个典型的示例,它展示了如何利用苹果系统播放器来...

    jquery制作仿iphone苹果手机界面触屏切换效果.rar

    在本项目中,“jquery制作仿iphone苹果手机界面触屏切换效果.rar”是一个使用jQuery库创建的Web应用程序,它旨在模拟iPhone或苹果手机的用户界面,尤其是触屏滑动切换的效果。这个项目对于开发者来说,是一个很好的...

    H5 Video标签调用摄像头进行录像,兼容苹果、安卓系统、可在微信浏览器正常使用

    在这个场景中,我们利用`&lt;video&gt;`标签的特定属性来实现调用用户设备的摄像头进行录像,并且确保这个功能在苹果iOS系统(如iPhone和iPad)和安卓Android系统上的浏览器,以及微信内置的浏览器中都能正常工作。...

    解决手机浏览器点击后退页面刷新问题,兼容苹果 safari浏览器和安卓浏览器

    解决手机浏览器点击后退页面刷新问题,兼容苹果 safari浏览器和安卓浏览器。 js的window.onbeforeunload,onunload,window.addEventListener(‘pagehide‘, () => {}手机浏览器不生效

    播放器横竖屏切换

    在iOS应用开发中,实现播放器的横竖屏切换是一项常见的需求,特别是在视频播放类的应用中。本示例由作者kevindcw提供,源码名为DvideoPlay,旨在展示如何实现在iOS设备上实现这一功能。以下是实现播放器横竖屏切换的...

    jquery制作仿iphone苹果手机界面触屏切换效果

    在本项目中,我们主要探讨如何使用jQuery框架和CoffeeScript来创建一个仿iPhone苹果手机界面的触屏切换效果。这个效果模拟了iOS设备上主屏幕的应用图标被触摸时的动态反馈,包括图标放大、震动以及返回原位的效果,...

    手机下载工具苹果安卓手机下载工具

    手机下载工具是现代移动设备用户不可或缺的软件,尤其在苹果iOS和安卓Android系统中,它们提供了方便快捷的方式去获取各种应用程序、游戏、音乐、视频和其他数字内容。标题“手机下载工具苹果安卓手机下载工具”表明...

    安卓android手机平板刷ipad IOS苹果系统

    现在的刷机教程层出不穷,但是没有哪个大神可以开发出一款安卓刷IOS的工具,使得安卓手机或者安卓平板变成IOS苹果系统,这个工具除了可以刷安卓手机也可以刷安卓平板,网友实测,如果设备不支持的话软件会提醒不支持...

    小程序蓝牙打印----安卓和苹果手机均兼容

    这篇内容将深入探讨如何在小程序中实现蓝牙打印,并且确保在安卓和苹果手机上兼容。 首先,我们要理解小程序的基本结构和工作原理。小程序是由一系列的页面组成,每个页面由WXML(结构层)、WXSS(样式层)和...

    C# 获取IMEI即获取移动设备手机串号手机编码号源代码

    本篇文章将详细讲解如何在C#中获取IMEI,主要针对Windows Phone和Android平台。 对于Windows Phone平台,我们可以使用`DeviceExtendedProperties`类来获取IMEI。以下是一个简单的示例: ```csharp using Microsoft...

    Android 使用html5得到手机设备信息

    PhoneGap是一个开源框架,它封装了JavaScript接口,使得开发者可以通过JavaScript调用Android的API,比如获取设备的唯一标识符、电池状态、网络类型等。 在提供的压缩包文件中,"JavaApk源码说明.txt"可能包含了...

    前端css兼容苹果手机以及华为p30pro.txt

    前段css兼容各个苹果手机以及华为p30pro 亲测有效@media screen ,花费了4个小时才研究出华为p30pro的兼容,没想到竟然和苹果的还不一样。看分辨率挺高,差距太大了

    使用H5在移动端(安卓、苹果)调用摄像头和文档

    用H5来调用自系统带摄像头和文件文档,兼容安卓和苹果。

    安卓手机显示苹果在线 亲测

    标题“安卓手机显示苹果在线 亲测”和描述中的“一款装13的软件”可能指的是一个能够让安卓手机模拟显示苹果设备在线状态的应用。这种应用通常被用来在社交平台上营造出用户正在使用苹果设备的假象,可能是为了满足...

    获取手机IMEI号、手机型号等

    在移动设备中,IMEI(International Mobile Equipment Identity)号是一个独特的15-17位数字序列号,用于识别每一部GSM和WCDMA网络的...在开发移动应用时,掌握如何获取和利用这些信息对于优化用户体验和服务至关重要。

    android仿苹果手机手表源码Demo

    android仿苹果手机手表源码Demo手表 安卓手表 苹果手表 苹果手表桌面.apk 为安卓上仿苹果手表的apk 。请安装在任何一部安卓设备上运行。 运行后出现苹果手表界面。 视频截图.gif 为运行后截图。 软件为softboy开发...

    原生JS+JQ仿写苹果手机指南针(带水平仪、位置、经纬度)

    在本项目中,开发者使用了原生JavaScript(JS)和jQuery(JQ)技术来创建一个功能丰富的模拟苹果手机指南针应用。这个应用不仅显示指南针方向,还提供了水平仪功能,以及实时的位置和经纬度信息。以下是关于这些知识...

    js预览图片 上传前预览图片 兼容ie6.7.8.9 ff 谷歌 opera 苹果浏览器不兼容

    这个标题提到的"js预览图片 上传前预览图片 兼容ie6.7.8.9 ff 谷歌 opera 苹果浏览器",表明这是一个旨在解决浏览器兼容性问题的解决方案,涵盖了老版本的Internet Explorer(IE6到IE9)以及Firefox、Chrome、Opera...

Global site tag (gtag.js) - Google Analytics