我想创建如下图所示的布局。我目前正在使用 Twitter Bootstrap 的布局和控件来创建 Web 应用程序。
外面的容器一个接一个,每个外面的容器里面都有容器。我希望所有容器都是可折叠的,即我希望最小化每个容器,包括外部容器。所有容器应在装载时显示在屏幕上。
当所有内部容器最小化/折叠时,父外部容器也应该折叠。我也愿意接受有关最小化父容器位置(左侧、顶部或底部)的建议。
我不确定如何创建此布局(使用手风琴控件或面板或任何其他人可能有的建议)并且想知道是否有人有合适的建议?
我想创建如下图所示的布局。我目前正在使用 Twitter Bootstrap 的布局和控件来创建 Web 应用程序。
外面的容器一个接一个,每个外面的容器里面都有容器。我希望所有容器都是可折叠的,即我希望最小化每个容器,包括外部容器。所有容器应在装载时显示在屏幕上。
当所有内部容器最小化/折叠时,父外部容器也应该折叠。我也愿意接受有关最小化父容器位置(左侧、顶部或底部)的建议。
我不确定如何创建此布局(使用手风琴控件或面板或任何其他人可能有的建议)并且想知道是否有人有合适的建议?
一些建议和想法。我希望它的指导有点!
您也许可以使用内置的 js 来管理它,但不太确定。但是,我相信可折叠性是用 js 执行的,但它规范了 css 代码,例如display
和visibility
. 我也相信这些可折叠的脚本是由文档末尾的 js 触发的,它只根据屏幕分辨率来触发。所以我不确定有多少脚本可以实际用于这种类型的可折叠性主动选择。如果我是你,我会考虑自己编写代码。
你想要什么样的内容在你的 div 中?(标题 A.1 - 标题 C.3)。为了获得更好的用户体验,我建议使用类似于我包含的图片的布局。特别是如果用户想从移动设备上查看它,但不是唯一的。垂直角度的文字基本上只是颈部疼痛。但是,如果您坚持采用这种方法,我建议您使用 Icons。
关于可用性和用户体验的布局建议。