javascript - 让用户调整 div 容器的大小，页面刷新后保存

Question

我的问题可能有点具体，但我找不到任何方法让它工作:我想要的是有 3 个 div 容器，用户可以调整大小(C 是 map ，而 B 是聊天和 A 一些其他信息，我希望用户能够决定他想要占用最多空间的内容)。这应该在页面刷新后保存，或者我可以保存内容的位置/大小以供重新加载。在这里你明白我的意思了，我想要水平调整 C 和垂直调整 A/B 的可能性

我试过的是:

• 在 CSS 中调整大小，它有多个问题，首先它在页面刷新后不保存(尽管我可以询问我认为的容器的大小并重新加载它)但更大的问题是如果我调整 A 的大小，B 不会变小但被推出我不想要的屏幕

• colResizable:一个用于表的 jQuery 插件，可以很好地用于水平 C 调整但不能垂直调整，此外它似乎与 Bootstrap 不兼容，因为某些原因它当我在代码中添加这一行时停止工作:

  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3./js/bootstrap.min.js"></script>      
  

  (我需要下拉菜单的 Bootstrap )

所以我真的连可以尝试的想法都没有了，也找不到任何其他在线提示，我正在使用 php 来保存 div A 中的更改，因此页面刷新不应重置调整大小。

如果有人对我有建议和想法，我将不胜感激 :)

Answer 1

听起来您实际上有多个问题:

1. 如何根据需要调整大小。为此，我建议使用 css 和内联样式，尤其是 flexbox。
2. 如何让用户在浏览器中选择宽度。可能带有或不带有 jquery 的 JavaScript。
3. 如何保存选择的宽度和高度，直到刷新后。为此，您可以使用 localstorage - 仅在同一台计算机上的同一浏览器中工作，或者使用更复杂的服务器端解决方案。为此，您可以使用任何服务器端语言，例如 php。