横屏竖屏操作

 <meta name="apple-touch-fullscreen" content="yes">
    <meta name="screen-orientation" content="portrait">
    <!-- 强制竖屏 -->

    <meta name="full-screen" content="yes">
    <!-- 强制全屏 -->

    <meta name="browsermode" content="application">
    <!-- 应用模式 -->

    <meta name="x5-orientation" content="portrait">
    <!-- QQ强制竖屏 -->

    <meta name="x5-fullscreen" content="true">
    <!-- QQ强制全屏 -->

    <meta name="x5-page-mode" content="app">
    <!-- QQ应用模式 -->

  var width = document.documentElement.clientWidth;
    var height =  document.documentElement.clientHeight;
    var w_c=$(".img_list img").width(),
        w_len=$(".img_list img").length,
        a_width=$(".btn-p").width(),
        img_width=$(".img_list").height(),
        bottom_width=$(".bottom-bg-img").width();
    function img_w() {
        //$(".img_list").width(img_width);
        $(".bg-img").width(w_c*w_len+a_width+bottom_width);
        $(".img_list img").css({ "display":"inline"})
    }

    if( width < height ){
        $(".bg-img").width("auto");
        $(".img_list img").css({ "display":"block"})
    }else {
        img_w()
    }

    var evt = "onorientationchange" in window ? "orientationchange" : "resize";

    window.addEventListener(evt, function() {
        console.log(evt);
        setTimeout( function(){
            var width = document.documentElement.clientWidth;
            var height =  document.documentElement.clientHeight;
            if( width > height ){
                img_w();

            }
            else{
                $(".bg-img").width("auto");
                $(".img_list img").css({ "display":"block"})
            }

        }  , 300 );


    }, false);
    if(window.orientation==90||window.orientation==-90){
        img_w()
        console.log("横屏状态！")
    }else if(window.orientation==0||window.orientation==180){
        console.log("竖屏状态！")
        $(".bg-img").width("auto");
        $(".img_list img").css({ "display":"block"})
    }