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

Question

我的问题可能有点具体，但我无法找到任何方法让它工作：我想要的是有3个div容器，用户可以调整大小（C是地图而B是一个聊天和一些其他信息，我希望用户能够决定他想占用最多空间的内容）。这应该在页面刷新后保存，或者我可以保存内容的位置/大小以进行重新加载。在这里你看到我的意思，我希望有可能水平调整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中的更改，因此页面刷新不应该＆＃39; t重置调整大小。

如果有人给我一个提示并知道如何做到这一点，我会非常感激：）

Answer 1

听起来你确实有多个问题：

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

Answer 2

你应该使用javascript来调整大小...无论如何你似乎已经解决了这个问题。 你能做的就是在调整大小结束时激活一个javascript函数（你用来调整大小的库应该有这个功能）创建一个cookie或调用一个ajax请求将信息发送到一个php文件保存到数据库永久。