zoukankan      html  css  js  c++  java
  • 手机开发网页模板(20140124)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <title>
    </title>
    <link href="favicona.ico" rel="shortcut icon">
    <link rel="stylesheet" href="base.css" type="text/css" />
    <link rel="stylesheet" href="index.css" type="text/css" />
    <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
    <!--百度统计-->
    <script>
    var _hmt = _hmt || [];
    </script>
    <script>
    //隐藏手机端浏览器地址栏
     window.onload=function(){ 
                    if(document.documentElement.scrollHeight <= document.documentElement.clientHeight) { 
                        bodyTag = document.getElementsByTagName('body')[0]; 
                        bodyTag.style.height = document.documentElement.clientWidth / screen.width * screen.height + 'px'; 
                    } 
                    setTimeout(function() { 
                        window.scrollTo(0, 1) 
                    }, 0); 
                }; 
    </script>
    </head>
    <body>

    <!--百度统计-->
    <script type="text/javascript">
    var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
    document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Ff6f01520213d4bb27fe309fd98eff173' type='text/javascript'%3E%3C/script%3E"));
    </script>
    </body>
    </html>

    用CSS判断横屏竖屏问题。CSS代码如下

    1、
    @media (orientation: portrait) { } 横屏
    @media (orientation: landscape) { }竖屏
     
    2、
    <link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css">横屏
    <link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css">竖屏

    用JavaScript判断横屏竖屏问题。JavaScript代码如下

    //判断手机横竖屏状态:
    function hengshuping(){
      if(window.orientation==180||window.orientation==0){
            alert("竖屏状态!")      
       }
    if(window.orientation==90||window.orientation==-90){
            alert("横屏状态!")       
        }
     }
    window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);
     
    //移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态。
    从而根据实际需求而执行相应的程序。通过添加监听事件onorientationchange,进行执行就可以了。


     

  • 相关阅读:
    数梦工场:新思维、新技术下的互联网+政务
    计算成就价值_数据实现梦想——达科在DT时代转型历程的分享
    AliSQL开源功能特性
    mysql 索引的使用
    sql经典面试题
    数据库理论知识点
    sql语句面试练习
    数据库范式的选择使用
    sql常用语句
    数据库范式
  • 原文地址:https://www.cnblogs.com/peng14/p/3532778.html
Copyright © 2011-2022 走看看