[JS]js代码判断移动终端ios苹果安卓平板设备横竖屏的情况代码实(2)
一个完整的例子: !DOCTYPEhtml html head meta charset = utf-8 meta content = text/html;charset=UTF-8 http-equiv = Content-Type title CuPlayer.com横竖屏测试网页 / title script type = text/javascript //
一个完整的例子:
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
- <title>CuPlayer.com横竖屏测试网页 </title>
- <script type="text/javascript">
- // Detect whether device supports orientationchange event, otherwise fall back to
- // the resize event.
- var supportsOrientationChange = "onorientationchange" in window,
- orientationEvent = supportsOrientationChange ? "orientationchange" : "resize";
- // CuPlayer.com提示:监听事件
- window.addEventListener(orientationEvent, function() {
- var ua = navigator.userAgent;
- var deviceType="";
- //CuPlayer.com提示:判断设备类型
- if (ua.indexOf("iPad") > 0) {
- deviceType = "isIpad";
- } else if (ua.indexOf("Android") > 0) {
- deviceType = "isAndroid";
- } else {
- alert("CuPlayer.com提示:既不是ipad,也不是安卓!");
- return;
- }
- // CuPlayer.com提示:判断横竖屏
- if ("isIpad" == deviceType) {
- if (Math.abs(window.orientation) == 90) {
- alert("我是ipad的横屏");
- } else {
- alert("我是ipad的竖屏");
- }
- } else if ("isAndroid" == deviceType ) {
- if (Math.abs(window.orientation) != 90) {
- alert("CuPlayer.com提示:我是安卓的横屏");
- } else {
- alert("CuPlayer.com提示:我是安卓的竖屏");
- }
- }
- }, false);
- </script>
- </head>
- <body>
- CuPlayer.com提示:横竖屏测试网页
- </body>
- </html>
热门文章推荐
- [JS]window.location获取url各项参数详解
- [JS]jQuery,javascript获得网页的高度和宽度
- [JS]视频弹窗视频弹出层videoLightBox(含三种播放器的用法)
- [JS]JS提交中文encodeURI两次转码
- [JS]js版方面encodeURI转码和decodeURI解码的用法实例
- [JS]js取当前机子的时间戳实例
- [JS]AES加密(基于crypto-js)PHP后端解密
- [JS]data:image/png;base64写法的用途及说明
请稍候...