zoukankan      html  css  js  c++  java
  • 横屏问题

    function orientation(){
        function initOrient(){
            var div = document.createElement("div"),
                error = document.createElement("div"),
                p1 = document.createElement("p"),
                p2 = document.createElement("p");
            div.className = 'orientation_tip hidden';
            error.className = 'error_page';
            p1.className = 'img';
            p2.innerHTML = '竖屏状态下使用,体验效果更佳';
            error.appendChild(p1);
            error.appendChild(p2);
            div.appendChild(error);
            document.body.appendChild(div);
            onorient();
        }
        function onorient(){
            if (window.orientation === 180 || window.orientation === 0) {
                $('.orientation_tip').hide();
                $('body').off('touchmove');
            }
            if (window.orientation === 90 || window.orientation === -90) {
                $('.orientation_tip').show();
                $('body').on('touchmove', function (event) {
                    event.preventDefault();
                }, false);
            }
        }
        initOrient();
        window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
            onorient();
        }, false);
    }
    
    export { orientation }
    
    //select和input在安卓手机上的对齐问题
    	function inputAlign(){
        		var u = navigator.userAgent;
      		  var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;
      		  if(isAndroid){
            			$('.padding-align').css({"paddingLeft" : '99px'});
       		 }
    	}
    
    	Domready(function(){
    	    orientation();
    	    inputAlign();
    	});
    
    
    .orientation_tip {
      position: fixed;
      top: 0;
      left: 0;
       100%;
      height: 100%;
      background: #fff;
      z-index: 1000; }
      .orientation_tip .error_page {
        height: 3.2rem;
        text-align: center;
        position: absolute;
        top: 50%;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
            transform: translate(0, -50%); }
        .orientation_tip .error_page p {
          margin-top: 0;
          padding-top: 0;
          text-align: center; }
        .orientation_tip .error_page .img {
           2.53333rem;
          height: 2.57333rem;
          margin: 0 auto;
          background: url("../img/fenqi/plutus04.png") no-repeat;
          background-size: 2.53333rem 2.57333rem; }
    
    .hide {
      display: none; }
      
    .error_page, .g-nothing {
      text-align: center;
       100%;
      overflow: hidden; }
      .error_page img, .g-nothing img {
        margin: 0 auto;
        display: block; }
        .error_page img.net, .g-nothing img.net {
           5.86667rem; }
        .error_page img.no-list, .g-nothing img.no-list {
           4rem; }
      .error_page p, .g-nothing p {
        margin-top: 0.26667rem;
        text-align: center; }
        .error_page p:first-of-type, .g-nothing p:first-of-type {
          padding-top: 2.53333rem; }
    
  • 相关阅读:
    Cocos2d-x学习之---自定义图标(带触摸事件)
    Cocos2d-x关于ScrollView
    学习实战三:基于Cocos2d-x引擎模仿微信打飞机游戏
    补算法相关知识一:蚂蚁算法
    避免Cocos2d-x编写的游戏在用eclipse生成安卓包时繁琐的写Android.mk文件
    Cocos2d-x学习之---模仿微信打飞机游戏敌机层设计初想
    Cocos2d-x学习之---2013年10月11日小记
    有时候真怕,时间会说出真心话。
    NO2:设置RedHat Linux下的samba开机启动
    NO1:在Windows端安装SecureCRT来连接Linux
  • 原文地址:https://www.cnblogs.com/sakura-sakura/p/6678076.html
Copyright © 2011-2022 走看看