模态弹框

标签：

<div class="modal fade" id="myModal-two" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true" style="margin-top: 100px;">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header">

//弹框头部内容
//关闭弹框按钮
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>

　　　　　　　　　　<h4 class="modal-title" style="text-align: center">
   　　　　　　　　 规划行程
　　　　　　　　　　</h4>
            </div>
            <div class="modal-body">               
              //弹框中部内容

　　　　　　　　<div id="map" style="margin: auto;line-height: 70px；font-size: 16px">
  　　　　　　　　  &nbsp;&nbsp;&nbsp;&nbsp;去规划
  　　　　　　  　　<img class="logo" src="next.png" alt="logo"/>
　　　　　　　　</div>
　　　　　　　　<div id="ready-ghua" style="margin:10px auto;line-height: 70px;font-size: 16px">
    　　　　　　　　&nbsp;&nbsp;&nbsp;&nbsp;去选择
    　　　　　　　　<img class="logo" src="next.png" alt="logo"/>
　　　　　　　　</div>
            </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
  <!--模态结束-->

JS部分：
//点击"规划"弹出提示框
$(‘.guihua‘).click(function(){
    $(‘#myModal-two‘).modal({
        keyboard: true
    });
});

模态弹框

标签：

原文地址：http://www.cnblogs.com/mo-cha/p/5798501.html