可调整大小的帧仿真

问题描述

| 我知道

<frameset>

和

<frame>

标签已被弃用。有没有办法模拟可调整大小的框架？我想要的是一个狭窄的分隔器，该分隔器可以水平或垂直分隔该区域，用户可以移动该分隔器，以便当它的一侧变小时，另一侧变大，反之亦然。我不想像传统框架一样用html页面填充每个框架，而是用一些DOM材料填充。 我知道CSS3具有

resize

属性，但是它只能控制自身的大小。我不确定这是否用于解决方案。 我不是特别喜欢使用JavaScript，但是我并没有排除在必要时使用它的可能性。     

解决方法

        请不要使用框架。我认为jQuery调整大小也不会对您有多大帮助。 最好的方法是使用\“ splitter \”。有几个用于jquery的插件将以许多不同的方式执行此操作，而它们实际上都非常简单。 我以前使用过这个：http://methvin.com/splitter/ 您可以在这里找到一个不错的演示：http://methvin.com/splitter/3psplitter.html     ,        从我的角度来看，jQuery Resizable或此类js都是您的解决方案。进行演示。 如果使用jQuery，您将有更多可能： 最大/最小尺寸 限制调整大小区域 延时启动 对齐网格 这是jQuery Resizable默认功能的示例代码：

<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>

    ,        您可能会喜欢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     ,        如果您不介意使用表格，Janus Troelsen的上述解决方案就是很好的选择。 我还发现了不带表的SoonDead解决方案，该解决方案在Chrome和FF上效果很好，但是不得不花费大量时间在IE8上。它在StackOverflow上的显示为“模拟框架集分隔符行为”     ,        我将研究Javascript和拖放支持。 实际上，一个模拟的框架集可能只有两个div，并且它们之间的手柄也可以抓住以调整大小。 JQuery提供了一些示例来演示如何调整元素的大小：http://jqueryui.com/demos/resizable/我认为扩展该概念以使其适合并不困难。 然后，我将通过AJAX加载文档，这可能会完全替换框架。