如何禁用'jQuery UI布局插件'在手机/平板电脑中

How to disable 'jQuery UI Layout plugin' in mobile/tablet?

本文关键字：手机 平板电脑 UI 何禁用 jQuery 布局 插件      更新时间：2023-09-26

在设计web（HTML/Javascript/Angular）UI时，我有一个左窗格，其中包含一个树视图和一个中心窗格（在右手边）。

我使用的是jQuery UI布局插件（Layout.jQuery-dev.net/index.cfm）。我有一个西窗格和中窗格，它工作得很好。

<div id="centralContainer" >
        <div class="ui-layout-west">
            <div>LEFT</div>
        </div>
        <div class="ui-layout-center">
            <div>MAIN</div>
        </div>
   </div>

但当最终用户使用移动设备或平板电脑查看页面时，我希望禁用布局，并将其替换为Bootstrap响应列。类似这样的东西：

<div id="centralContainer" class="row">
        <div class="ui-layout-west" class="col-sm-4">
            <div>LEFT</div>
        </div>
        <div class="ui-layout-center" class="col-sm-8">
            <div>MAIN</div>
        </div>
   </div>

最好的方法是什么？我不知道该怎么解决？有几种情况下，桌面UI应该与移动UI不同，我不知道处理它的最佳方式是什么。

您是否在寻求一种检测它是否是移动设备的方法
可以做到这一点

   var useragent = navigator.userAgent.toLowerCase();
   if (useragent.search("blackberry") > -1 
   ||  useragent.search("android") > -1
   ||  useragent.search("iphone") > -1 
   ||  useragent.search("webos") > -1  
   ||  useragent.search("ipad") > -1){
       window.location.href ="mobileindex.html";
   }

或者使用中的脚本http://detectmobilebrowsers.com/

相关文章：