Question

我有两个屏幕，分别是屏幕1和屏幕2，以及一个带有JavaScript / JQuery的HTML页面我想要做的是将HTML分成两个视图。一个在屏幕1上，另一个在屏幕2上。
屏幕1具有简单的视图（例如，供客户观看的电影屏幕），屏幕2具有所有控制（例如，另一端的人可见）。任何可能的解决方案？

Answer 1

最好的解决方案是拥有2个不同的页面，毕竟它是a 系统而不是页面。
但是，既然您需要一种解决方法，请使用Bootstrap（它就是这样响应，所以应该很容易适应2屏幕显示）。

将Bootstrap添加到HTML＆lt; head＆gt;：

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

到HTML＆lt; body＆gt;：

<div class="wrapper-fluid">
  <div class="container-fluid">
    <div class="row">
      <div id="screen1" class="col-md-6">
        <!-- PAGE 1 HERE -->
      </div>
      <div id="screen2" class="col-md-6">
        <!-- PAGE 2 HERE -->
      </div>
    </div>
  </div>
</div>

和CSS：

#screen1 {
  background-color: blue;
  height: 900px;
}
#screen2 {
  background-color: green;
  height: 900px;
}

Answer 2

这是旧学校，但我最近刚刚使用锚标记内的“target”属性做了类似的事情。打开两个浏览器窗口，将“显示”设置为全屏，第一个屏幕（控制屏幕）上的链接指向第二个浏览器窗口。例如：

          var selection = document.getSelection();

  if (selection.rangeCount > 0) {
    var selectionString = selection.toString(),
      choicesCleaned = selectionString.replace(/[(]*([a-zA-Z])[.)][.)]*([\w ,]*[ ])/g, "$1.$2 "),
      parent = getSelectionParentElement(),
      parentId = $(parent).attr('id');
console.log('parentId: ' + parentId);
console.log(selectionString);
console.log(choicesCleaned);

无需编程。

拆分一个HTML页面以在多个屏幕上显示不同的视图

2 个答案: