docs: Add hover over links on headings

This commit is contained in:
Nick Craig-Wood 2016-08-22 17:21:06 +01:00
parent 1e7dc06ab8
commit 8a771450d2
4 changed files with 33 additions and 2 deletions

View File

@ -9,6 +9,7 @@
"description": "rclone - rsync for cloud storage: google drive, s3, swift, cloudfiles, dropbox, memstore...",
"canonifyurls": true,
"blackfriday": {
"smartDashes": false
"smartDashes": false,
"plainIDAnchors": true
}
}

View File

@ -1,5 +1,6 @@
<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.js"></script>
<script src="/js/custom.js"></script>
</body>
</html>
</html>

View File

@ -24,3 +24,18 @@ thead td, th {
tbody tr:nth-child(odd) {
background-color:#d0d0ff
}
/* Hover over links on headers */
.header-link {
position: absolute;
left: -0.5em;
opacity: 0;
transition: opacity 0.2s ease-in-out 0.1s;
}
h2:hover .header-link,
h3:hover .header-link,
h4:hover .header-link,
h5:hover .header-link,
h6:hover .header-link {
opacity: 1;
}

14
docs/static/js/custom.js vendored Normal file
View File

@ -0,0 +1,14 @@
// Site JS
// Add hover links on headings
$(function() {
return $("h2, h3, h4, h5, h6").each(function(i, el) {
var $el, icon, id;
$el = $(el);
id = $el.attr('id');
icon = '<i class="fa fa-link"></i>';
if (id) {
return $el.prepend($("<a />").addClass("header-link").attr("href", "#" + id).html(icon));
}
});
});