1.使用栅格:
在.modal-body中加入 .container-fluid 栅格系统,可以在动态视窗中使用Bootsrap栅格系统,并在任何地方使用正常的栅格系统class定义。
2.同框不同文-基于触发按钮的多样化模态框,
想定义一组按钮,它们所触发的模态框相同,但内容不同?请使用event.relatedTarget 和 HTMLdata-*属性 (或通过 使用 jQuery)依据所点按钮的定义来动态加载弹出窗口中的内容。
下面即是一组基于HTML和 JavaScript组合使用的范例,更多细节可参考 模态框事件 中的 relatedTarget属性。
3.移除动画效果:
如果只要弹出模态而不需要淡入淡出效果,请从你的模态窗元素中定义移除 .fade 即可(aria-hidden="true"。
4.动态高度:
如果模态的高度在打开时发生变化,则应调用code>$('#myModal').data('bs.modal').handleUpdate() 或 $('#myModal').modal('handleUpdate') 重新调整模态框的位置,以防滚动条出现。
无障碍易用性处理
请务必在.modal和 role="document"模态框标题的.modal-dialog 中添加 .modal-dialog 和 aria-labelledby="..."。另外,您可以使用 .modal 上的 aria-descriptby 來描述你的動態視窗,优化无障碍浏
在.modal-body中加入 .container-fluid 栅格系统,可以在动态视窗中使用Bootsrap栅格系统,并在任何地方使用正常的栅格系统class定义。
2.同框不同文-基于触发按钮的多样化模态框,
想定义一组按钮,它们所触发的模态框相同,但内容不同?请使用event.relatedTarget 和 HTMLdata-*属性 (或通过 使用 jQuery)依据所点按钮的定义来动态加载弹出窗口中的内容。
下面即是一组基于HTML和 JavaScript组合使用的范例,更多细节可参考 模态框事件 中的 relatedTarget属性。
3.移除动画效果:
如果只要弹出模态而不需要淡入淡出效果,请从你的模态窗元素中定义移除 .fade 即可(aria-hidden="true"。
4.动态高度:
如果模态的高度在打开时发生变化,则应调用code>$('#myModal').data('bs.modal').handleUpdate() 或 $('#myModal').modal('handleUpdate') 重新调整模态框的位置,以防滚动条出现。
无障碍易用性处理
请务必在.modal和 role="document"模态框标题的.modal-dialog 中添加 .modal-dialog 和 aria-labelledby="..."。另外,您可以使用 .modal 上的 aria-descriptby 來描述你的動態視窗,优化无障碍浏