Bootstrap Skeleton
This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.
by bradleytrager
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="popover-markup">
<a href="#" class="trigger">Popover link</a>
<div class="head hide">Lorem Ipsum</div>
<div class="content hide">
<input type="text" placeholder="Type something…"/>
<button type="submit" class="btn">Submit</button>
</div>
<div class="footer hide">test</div>
</div>
<div class="popover-markup">
<a href="#" class="trigger">Popover link II</a>
<div class="head hide">Lorem Ipsum II</div>
<div class="content hide">
<input type="text" placeholder="Type something II…"/>
<button type="submit" class="btn">Submit</button>
</div>
<div class="footer hide">test</div>
</div>
CSS
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
body {
margin: 100px 10px;
}
JavaScript
$('.popover-markup>.trigger').popover({
html : true,
title: function() {
return $(this).parent().find('.head').html();
},
content: function() {
return $(this).parent().find('.content').html();
}
});