javascript – 如何使dhtmlx响应？

2019-07-06 11:35:29 阅读：198 来源： 互联网

标签：javascript twitter-bootstrap-3 responsive-design dhtmlx

我的问题：我使用Bootstrap和DHTMLX来构建一个Web应用程序,该应用程序有一个主页,侧边栏和不同的其他页面,我在其中使用DHTMLX来构建布局,网格和我使用其他DHTMLX组件.我设法让我的主页响应,其他HTML组件也完美地显示在不同的设备,但我的问题是DHTMLX布局和网格,从来没有响应！我一直在寻找并试图找到一种方法来使其响应,因为我有大量的页面,但每个页面都可以有DHTMLX的布局模式(主要使用1C,2U,3L,3T,3U多级布局)太)

我的想法是：我注意到了一些事情,如果我根据使用的不同媒体动态更改DHTMLX布局,这可能是一个解决方案,例如：在其中一个页面上我有一个2U布局,在桌面上显示得很好屏幕,但它可怕地显示在智能手机设备上 – 较窄的媒体 – 所以2U必须转换为2E,这使它至少更容易查看和使用

我的问题 – 或者问题 – ：我是否考虑过最简单的方法来使我的Web应用程序响应,甚至我正在尝试做的是响应概念？

这不是讨论 – 我不希望我的问题被关闭 – 我只需要一个答案来指导我以正确的方式,但我非常感谢在正确的地方进行答案讨论.

解决方法:

您应该能够将onresize处理程序与onload处理程序一起使用.您只需卸载布局并在每次调整窗口大小时重新创建它：

<script>
  var layout
  var currentPattern

  function setLayout() {
    var width = window.innerWidth

    if (width < 600) {
      var pattern = "2E"
    } else {
      var pattern = "2U"
    }

    if (pattern == currentPattern) {
      return
    } else {
      currentPattern = pattern
    }

    if (layout) {
      layout.unload()
    }

    layout = new dhtmlXLayoutObject({
      parent: "your-layout-id",
      pattern: pattern
    })
  }

  window.onresize = setLayout
</script>
<body onl oad="setLayout()">
  <div id="your-layout-id">...</div>
</body>

标签：javascript,twitter-bootstrap-3,responsive-design,dhtmlx
来源： https://codeday.me/bug/20190706/1397107.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – 如何使dhtmlx响应？