mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-23 21:53:25 +02:00
Code Issues Releases Wiki Activity

adds twipsy js to regular index for positioning

Browse Source
This commit is contained in:
Jacob Thornton
2011-09-10 14:52:45 -07:00
parent 39fc13093e
commit a8d4475827
6 changed files with 28 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/assets/css/docs.css
View File

@@ -46,7 +46,7 @@ section > .row {
font-weight: bold;
}
#masthead {
margin-top: 40px;
padding-top: 40px;
}
#masthead h1,
#masthead p {
@@ -175,6 +175,7 @@ section > .row {
box-shadow: 0 1px 2px rgba(0,0,0,.075);
}
.diagram {
height: 140px;
padding: 4px;
}
.mini-layout {

47
docs/assets/js/application.js
View File

@@ -42,42 +42,15 @@ $(document).ready(function(){
// POSITION STATIC TWIPSIES
// ========================
$('.twipsies.well a').each(function () {
var type = this.title
, $anchor = $(this)
, $twipsy = $('.twipsy.' + type)
, twipsy = {
width: $twipsy.width() + 10
, height: $twipsy.height() + 10
}
, anchor = {
position: $anchor.position()
, width: $anchor.width()
, height: $anchor.height()
}
, offset = {
above: {
top: anchor.position.top - twipsy.height
, left: anchor.position.left + (anchor.width/2) - (twipsy.width/2)
}
, below: {
top: anchor.position.top + anchor.height
, left: anchor.position.left + (anchor.width/2) - (twipsy.width/2)
}
, left: {
top: anchor.position.top + (anchor.height/2) - (twipsy.height/2)
, left: anchor.position.left - twipsy.width - 5
}
, right: {
top: anchor.position.top + (anchor.height/2) - (twipsy.height/2)
, left: anchor.position.left + anchor.width + 5
}
}
$twipsy.css(offset[type])
});
$(".twipsies a").each(function () {
$(this)
.twipsy({
live: false
, placement: $(this).attr('title')
, trigger: 'manual'
, offset: 2
})
.trigger('twipsy:show')
})
});

23
docs/index.html
View File

@@ -22,6 +22,7 @@
<script src="assets/js/google-code-prettify/prettify.js"></script>
<script>$(function () { prettyPrint() })</script>
<script src="../js/bootstrap-dropdown.js"></script>
<script src="../js/bootstrap-twipsy.js"></script>
<script src="assets/js/application.js"></script>
<script src="assets/js/application-scrollspy.js"></script>
@@ -1356,22 +1357,6 @@
<p class="muted" style="margin-bottom: 0">
Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> veritatis aut iste perspiciatis iste voluptas natus illo quasi odit aut natus consequuntur consequuntur, aut natus illo voluptatem odit perspiciatis laudantium rem doloremque totam voluptas. <a href="#" title="right">Voluptasdicta</a> eaque beatae aperiam ut enim voluptatem explicabo explicabo, voluptas quia odit fugit accusantium totam totam architecto explicabo sit quasi fugit fugit, totam doloremque unde sunt <a href="#" title="left">sed</a> dicta quae accusantium fugit voluptas nemo voluptas voluptatem <a href="#" title="above">rem</a> quae aut veritatis quasi quae.
</p>
<div class="twipsy below">
<div class="twipsy-arrow"></div>
<div class="twipsy-inner">below!</div>
</div>
<div class="twipsy right">
<div class="twipsy-arrow"></div>
<div class="twipsy-inner">right!</div>
</div>
<div class="twipsy left">
<div class="twipsy-arrow"></div>
<div class="twipsy-inner">left!</div>
</div>
<div class="twipsy above">
<div class="twipsy-arrow"></div>
<div class="twipsy-inner">above!</div>
</div>
</div>
</div>
</div>
@@ -1437,15 +1422,15 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
</tr>
<tr>
<td><a href="./javascript.html#dropdowns">bootstrap-dropdown.js</a></td>
<td>This plugin is for adding dropdown to the bootstrap nav.</td>
<td>This plugin is for adding dropdowns to the bootstrap topbar or tabbed navigations.</td>
</tr>
<tr>
<td><a href="./javascript.html#tabs">bootstrap-tabs.js</a></td>
<td>This plugin adds quick, dynamic tab and pill functionality.</td>
<td>This plugin adds quick, dynamic tab and pill functionality for cycling through local content.</td>
</tr>
<tr>
<td><a href="./javascript.html#twipsy">bootstrap-twipsy.js</a></td>
<td>Based on the excellent jQuery.tipsy plugin written by Jason Frame; twipsy is an updated version, which doesn't rely on images, uses css3 for animations, and data-attributes for title storage!</td>
<td>Based on the excellent jQuery.tipsy plugin written by Jason Frame; twipsy is an updated version, which doesn't rely on images, uses css3 for animations, and data-attributes for local title storage!</td>
</tr>
<tr>
<td><a href="./javascript.html#popover">bootstrap-popover.js</a></td>