Bootstrap的js插件之警告框(alert.js)

最新推荐文章于 2023-11-26 19:14:40 发布

bboyjoe

最新推荐文章于 2023-11-26 19:14:40 发布

阅读量7.6k

点赞数

分类专栏： bootstrap 文章标签： bootstrap html5 前端响应式插件

本文链接：https://blog.csdn.net/bboyjoe/article/details/47344507

版权

bootstrap 专栏收录该内容

32 篇文章 2 订阅

订阅专栏

data-dismiss="alert"——为关闭按钮添加该属性可以使其自动为警告框赋予关闭功能；

.fade .in——为警告框在关闭时添加动画效果；

更多细节参考示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>js插件_警告框</title>
    <link rel="stylesheet" href="bootstrap.min.css" type="text/css">
    <!--<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">-->
    <script src="jquery-1.11.1.min.js"></script>
    <script src="bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <h3>警告框示例</h3>

    <div class="alert alert-info alert-dismissible fade in" role="alert" id="myAlert">
        <button type="button" class="close" data-dismiss="alert" aria-label="close">
            <span aria-disabled="true">×</span>
        </button>
        感谢您选择<strong><要投哪></strong>
        <button type="button" class="btn btn-primary">详情</button>
    </div>
</div>
<script>
//    $("#myAlert").alert('close');
//    $('#myAlert').on('closed.bs.alert',function(e){
//        alert("关闭了");
//    })
</script>

</body>
</html>

bboyjoe

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Bootstrap的js插件之警告框(alert.js)

data-dismiss="alert"——为关闭按钮添加该属性可以使其自动为警告框赋予关闭功能；.fade .in——为警告框在关闭时添加动画效果；更多细节参考示例： js插件_警告框 --> 警告框示例 × 感谢
复制链接

扫一扫