1.html head包含所有css文件 2.body form tag添加了按钮控件 3.体型定义的模态框,带淡入淡出 4.包括bootstrap jquery
普通模态正在工作(启动演示模态),但“动画模态”按钮无法正常工作
! - begin snippet:js hide:false - >
<!DOCTYPE html>
<html lang="en">
<head runat="server">
<link href="dist/css/bootstrap.min.css" rel="stylesheet">
<link href="dist/css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="dist/css/animate.min.css" rel="stylesheet">
</head>
<body>
<form id="form1" runat="server">
<div class="container">
<h1>Hello, world!</h1>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal16">
Animation modal
</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">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<div id="myModal16" class="modal hide" data-easein="rotateInDownRight" data-easeout="rotateOutDownRight" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel1">Modal header 2</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
<script src="Scripts/jquery-2.1.1.min.js"></script>
<script src="dist/js/bootstrap.min.js"></script>
</div>
</form>
</body>
</html>