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

Question

我有两个屏幕，屏幕1和屏幕2和一个HTML页面与JavaScript/JQuery。
我要做的是将HTML拆分为两个视图。一个在屏幕1，另一个在屏幕2。
屏幕1有一个简单的视图(例如供客户查看的电影院屏幕)，屏幕2有所有的控件(例如对另一端的人可见)。有什么可能的解决方案吗?

Answer 1

最好的解决方案是有2个不同的页面，毕竟它是一个系统而不是页面。
• 但是，既然你想要一个解决方案，使用Bootstrap(它的响应，所以应该很容易适应2屏幕显示)。

添加Bootstrap到HTML

:

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

body>:

<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"属性做了类似的事情。打开两个浏览器窗口，将"显示"设置为全屏，第一个屏幕(控制屏幕)上的链接指向第二个浏览器窗口。例如:

<a target='songs' href='/freebird.html'>Freebird</a>

无需编程