Bootstrap中如何设置告警框（alert）的弹出效果及短暂显示功能？

本文共计805个文字，预计阅读时间需要4分钟。

最近使用bootstrap的警告框时发现，仅提供了HTML的说明，于是自己编写了一个弹出警告框和弹出短暂显示后上浮消失的警告框。使用效果如下：- 弹出效果：效果显著- 移入时停止：效果良好- 直接上JS代码：如下

javascript// 弹出警告框函数function showWarningBox(message) { var box=document.createElement('div'); box.className='warning-box'; box.innerHTML=message; document.body.appendChild(box);

// 短暂显示后上浮消失 setTimeout(function() { box.style.opacity='0'; box.style.position='absolute'; box.style.top='10px'; box.style.right='10px'; box.style.transition='opacity 0.5s';

setTimeout(function() { document.body.removeChild(box); }, 500); }, 3000);}

// 示例调用showWarningBox('这是一条警告信息！');

最近用到bootstrap的告警框时发现只有html的说明，就自己写了一个弹出告警框和弹出短暂显示后上浮消失的告警框。