Commit 40f671a5 authored by Mark Otto's avatar Mark Otto
Browse files

add basic back to top link via affix

parent e560c41e
Showing with 61 additions and 12 deletions
+61 -12
...@@ -28,6 +28,26 @@ body { ...@@ -28,6 +28,26 @@ body {
padding-right: 15px; padding-right: 15px;
} }
/* Back to top link */
.bs-docs-top {
float: left;
padding: 7px 15px;
font-weight: 500;
color: #999;
background-color: #eee;
border-radius: 4px;
}
.bs-docs-top:hover {
color: #fff;
text-decoration: none;
background-color: #999;
}
.bs-docs-top.affix {
position: fixed;
right: 15px;
bottom: 15px;
}
/* Sections /* Sections
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
e.preventDefault() e.preventDefault()
}) })
// side bar // back to top
// setTimeout(function () { // setTimeout(function () {
// $('.bs-docs-sidenav').affix({ // $('.bs-docs-sidenav').affix({
// offset: { // offset: {
...@@ -23,6 +23,10 @@ ...@@ -23,6 +23,10 @@
// }) // })
// }, 100) // }, 100)
setTimeout(function () {
$('.bs-docs-top').affix()
}, 100)
// make code pretty // make code pretty
window.prettyPrint && prettyPrint() window.prettyPrint && prettyPrint()
......
...@@ -3,7 +3,6 @@ layout: default ...@@ -3,7 +3,6 @@ layout: default
title: Bootstrap Documentation title: Bootstrap Documentation
--- ---
<div class="bs-docs-container"> <div class="bs-docs-container">
<!-- Welcome <!-- Welcome
...@@ -4470,20 +4469,42 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline. ...@@ -4470,20 +4469,42 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>Linkify list group items by using anchor tags instead of list items (that also means a parent <code>&lt;div&gt;</code> instead of an <code>&lt;ul&gt;</code>. No need for individual parents around each element.</p> <p>Linkify list group items by using anchor tags instead of list items (that also means a parent <code>&lt;div&gt;</code> instead of an <code>&lt;ul&gt;</code>. No need for individual parents around each element.</p>
<div class="bs-docs-example"> <div class="bs-docs-example">
<div class="list-group"> <div class="list-group">
<a href="#" class="list-group-item active">Cras justo odio</a> <a href="#" class="list-group-item active">
<a href="#" class="list-group-item">Dapibus ac facilisis in</a> Cras justo odio
<a href="#" class="list-group-item">Morbi leo risus</a> <span class="glyphicon glyphicon-chevron-right"></span>
<a href="#" class="list-group-item">Porta ac consectetur ac</a> </a>
<a href="#" class="list-group-item">Vestibulum at eros</a> <a href="#" class="list-group-item">Dapibus ac facilisis in
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<a href="#" class="list-group-item">Morbi leo risus
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<a href="#" class="list-group-item">Porta ac consectetur ac
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<a href="#" class="list-group-item">Vestibulum at eros
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div> </div>
</div> </div>
{% highlight html linenos %} {% highlight html linenos %}
<div class="list-group"> <div class="list-group">
<a href="#" class="list-group-item active">Cras justo odio</a> <a href="#" class="list-group-item active">
<a href="#" class="list-group-item">Dapibus ac facilisis in</a> Cras justo odio
<a href="#" class="list-group-item">Morbi leo risus</a> <span class="glyphicon glyphicon-chevron-right"></span>
<a href="#" class="list-group-item">Porta ac consectetur ac</a> </a>
<a href="#" class="list-group-item">Vestibulum at eros</a> <a href="#" class="list-group-item">Dapibus ac facilisis in
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<a href="#" class="list-group-item">Morbi leo risus
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<a href="#" class="list-group-item">Porta ac consectetur ac
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
<a href="#" class="list-group-item">Vestibulum at eros
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div> </div>
{% endhighlight %} {% endhighlight %}
...@@ -6476,3 +6497,7 @@ $('[data-spy="affix"]').each(function () { ...@@ -6476,3 +6497,7 @@ $('[data-spy="affix"]').each(function () {
</section> </section>
</div><!-- /.container --> </div><!-- /.container -->
<a href="#welcome" class="bs-docs-top">
Back to top
</a>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment