jQuery网站公告信息弹窗提示代码

jQuery网站公告信息弹窗提示代码

一款简单的jQuery modal网站公告信息弹窗提示代码,也可以作为弹窗广告使用,本实例是弹出图片公告,懂的朋友也可以改成文字公告。

使用方法
在页面引入相关CSS样式文件

1
<link rel="stylesheet" type="text/css" href="css/style.css"/>

JS代码文件

1
2
3
4
5
6
7
<script type="text/javascript" src="js/jquery-1.8.2-min.js"></script>
<script type="text/javascript" src="js/modal.js"></script>
    <script>
        $(function(){
            $('#triggerModel').trigger('click');
        });
    </script>

HTML结构代码

1
2
3
4
5
6
7
8
9
10
11
    <button id="triggerModel" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">测试按钮</button>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
       <div class="modal-dialog">
          <div class="modal-content">
          <img src="images/qrxd-notice.png" />
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
             </div>
             </div>
         </div>
    </div>
温馨提示:此处内容需要评论本文后才能查看。
5

评论:

2 条评论,访客:2 条,站长:0 条

最新评论

发表评论