如何拆分瀏覽器窗口

Question

我正在研究一個基於Web的應用程序，我需要垂直拆分瀏覽器窗口。 右欄將是html/css和應用程序的內容部分，而左欄將顯示另一個網站，它將使用大部分空間。 我相信我可以用iframe來做到這一點，但我想知道是否有其他方法可以給它。

左欄是應用程序的一部分，因此如果用戶選擇禁用它，並且外部網站/ iframe應該佔用整個窗口寬度，那麼它是可選的。

我需要爲兩列有兩個垂直滾動條，左列不應該與另一列重疊。

如果有人能指引我正確的方向，我將不勝感激。

謝謝。

Answer 1

您可以使用div分割窗口，並通過隱藏一個div另一個將使用該空間。檢查此代碼示例：

<button onclick="document.getElementById('leftArea').style.display='none'">Hide Left Area</button> 

      <div style="width:100%; height:100%"> 
       <div id="leftArea" style="float:left;width:50%;background-color:#FF0000"> 
        Left Area - iframe below:<br/> 
        <iframe src="" width="100%" height="100%"> </iframe> 
       </div> 
       <div style="width:100%; background-color:#0000FF"> 
       Right Area 
       </div> 
      </div> 

Answer 2

檢查了這一點。 可能是一個可能的解決方案，但我個人認爲iframe是要走的路。

http://camendesign.com/code/splitscreen