jquery+css3实现页面强制竖屏特效

jquery+css3实现页面强制竖屏特效是一款非常实用的作品，主要用到html5移动页面上，可以根据页面用横屏和竖屏体验的效果来强制页面的显示。。。

分类：其它特效 > jQuery插件难易：入门级

查看演示下载资源下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

首先引入jquery库和zepto插件。

<script src="style/js/zepto.min.js"></script>
<link rel="stylesheet" href="style/css/knowledge_wap_new.min.css" />

禁止横屏 begin

<div class="mask flexcontainer" id="mask">
  <div class="mask-box">
    <div class="mask-pic"> <i></i> </div>
    <span>为了更好的体验，请将手机/平板竖过来</span> </div>
</div>

禁止横屏 edn 避免搜索影响屏幕尺寸判断

$("#textInput").on('focus',function(){
        $("#mask").hide();
    });
    $(window).on('orientationchange',function(){
        switch(window.orientation){
           case -90:
           case 90:
               $("#mask").show();
               break;
           case 0:
               $("#mask").hide();
               break;
        }
    });