rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-18 15:54:26 +01:00
Code Issues Actions Packages Releases Activity

Merge pull request #16018 from twbs/modal-visual

Browse Source 
Enhancements to Modal visual test
This commit is contained in:
Chris Rebert 2015-03-08 21:33:25 -07:00
commit 2c56b0feb0
1 changed files with 41 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
js/tests/visual/modal.html
View File

@ -13,9 +13,41 @@
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
#tall {
height: 1500px;
width: 100px;
background-color: black;
color: white;
}
</style>
</head>
<body>
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">navbar-static-top</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">This should not jump to the left when the modal is shown.</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="page-header">
@ -99,6 +131,12 @@
Launch demo modal
</button>
<button id="tall-toggle" class="btn btn-default">Toggle tall &lt;body&gt; content</button>
<br><br>
<div id="tall" style="display: none;">
Tall body content to force the page to have a scrollbar.
</div>
</div>
<!-- JavaScript Includes -->
@ -114,6 +152,9 @@
$(function () {
$('.js-popover').popover()
$('.js-tooltip').tooltip()
$('#tall-toggle').click(function () {
$('#tall').toggle()
})
})
</script>