可調整大小的幀模擬

據我所知，<frameset>和<frame>標記正在被棄用。有沒有辦法模仿可調整大小的框架？我想要的是一個狹窄的分離器，將水平或垂直的區域分開，用戶可以移動這個區域，以便當其中一邊變小時，另一邊變大，反之亦然。我不想用傳統框架的HTML頁面填充每個框架，而是使用一些DOM材料。可調整大小的幀模擬

我知道CSS3具有resize屬性，但它僅控制自身的大小。我不確定這是否會用於解決方案。

我不特別喜歡使用JavaScript，但我不排除如果有必要使用它的可能性。

來源

2011-05-30 sawa

[這是我能想到的最好的]（http://jsfiddle.net/ysangkok/2YBWb/1/）。JavaScript和沒有垂直欄（依靠CSS3的大小調整）。應該很容易移植到香草JS。 – 2012-09-23 02:41:01

不，幀不會被棄用**如果您使用正確的HTML4.01文檔類型（HTML4.01/XHTML1.0與HTML5 btw中的'acronym'元素相同）。現在，我明顯不會將它用於客戶端項目，但可能仍然用於技術文檔（或者不是，因爲在這種情況下，我不會在乎IE6/7，而IE8有* OK *支持諸如'position：固定'的側邊欄） – FelipeAls 2012-09-23 08:47:59

你是否在尋找這樣的東西http://jsbin.com/ – Champ 2012-09-28 16:45:42

請勿使用框架。我不認爲jQuery調整大小也會幫助你。

做到這一點的最好方法是使用「分離器」。有幾個jquery的插件可以用很多不同的方式來實現，而且它們都很簡單。

我以前用這一個：http://methvin.com/splitter/

你可以找到一個很好的演示在這裏：以上http://methvin.com/splitter/3psplitter.html

來源

2012-09-29 20:42:51

這太好了。我終於得到了我想要的東西。謝謝。 – sawa 2012-09-30 05:07:03

顯然這個插件不再保留（2017年）所有的樣本不能在Chrome版本60.0.3112.113上工作，至少他們不顯示幀類型視圖或調整大小的能力。 – raphie 2017-08-31 20:02:59

我會看看JavaScript和拖放支持。

實際上，一個模擬的框架集可能只是兩個div和它們之間的一個句柄，可以抓取它們來調整大小。 JQuery有示例來演示如何調整元素的大小：http://jqueryui.com/demos/resizable/我認爲將這個概念擴展爲合適並不是很困難。

然後我會通過AJAX加載文件，這可能可能完全取代幀。

來源

2011-05-30 08:12:10 Palantir

你可能會喜歡這個鏈接，YUI http://people.ischool.berkeley.edu/~rdhyee/yui/examples/layout/panel_layout.html

例子： http://people.ischool.berkeley.edu/~rdhyee/yui/examples/layout/panel_layout_source.html

來源

2011-06-01 03:28:15 mathijsbrand

從我的角度jQuery Resizable或JS等東西的一點是你的解決方案。去它的demos。
在使用jQuery的情況下，你將有額外的可能性：

最大/最小尺寸
約束調整區域
延時啓動
對齊網格

這裏是一個jQuery可調整大小的默認功能示例代碼：

<style> 
    #resizable { 
     width: 150px; 
     height: 150px; 
     display: block; 
     border: 1px solid gray; 
     text-align: center; 
    } 
</style> 

<script> 
    $(function() { 
     $("#resizable").resizable(); 
    }); 
</script> 

<div id="resizable"> 
    <h3>Resizable</h3> 
</div>

來源

2012-05-28 04:10:56

劍鋒Troelsen的解決方案是巨大的，如果你不介意的表。我也發現SoonDead沒有表格，這個解決方案在Chrome和FF上效果很好，但不得不花費大量的時間用於IE8。它在StackOverflow上爲「Emulate Frameset Separator Behavior」

來源

2014-03-16 09:47:44 user3236820

可調整大小的幀模擬

回答

相關問題