mirror of
https://github.com/ascribe/wp-theme
synced 2024-12-22 09:13:38 +01:00
switch to local copy of toc.js
This commit is contained in:
parent
ed1c8ef7ed
commit
67fd915c24
@ -1,5 +1,5 @@
|
|||||||
|
|
||||||
//=include ../../../node_modules/toc/dist/toc.js
|
//=include vendor/toc.js
|
||||||
|
|
||||||
var Faq = (function(w, d, $) {
|
var Faq = (function(w, d, $) {
|
||||||
|
|
||||||
@ -27,7 +27,6 @@ var Faq = (function(w, d, $) {
|
|||||||
_config.faqToc.toc({
|
_config.faqToc.toc({
|
||||||
'selectors': _config.faqTitle, // elements to use as headings
|
'selectors': _config.faqTitle, // elements to use as headings
|
||||||
'container': 'body', // element to find all selectors in
|
'container': 'body', // element to find all selectors in
|
||||||
'smoothScrolling': true, // enable or disable smooth scrolling on click
|
|
||||||
'highlightOffset': 200, // offset to trigger the next headline
|
'highlightOffset': 200, // offset to trigger the next headline
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
193
assets/_src/js/vendor/toc.js
vendored
Normal file
193
assets/_src/js/vendor/toc.js
vendored
Normal file
@ -0,0 +1,193 @@
|
|||||||
|
/*!
|
||||||
|
* toc - jQuery Table of Contents Plugin
|
||||||
|
* v0.3.2
|
||||||
|
* http://projects.jga.me/toc/
|
||||||
|
* copyright Greg Allen 2014
|
||||||
|
* MIT License
|
||||||
|
*/
|
||||||
|
/*!
|
||||||
|
* smooth-scroller - Javascript lib to handle smooth scrolling
|
||||||
|
* v0.1.2
|
||||||
|
* https://github.com/firstandthird/smooth-scroller
|
||||||
|
* copyright First+Third 2014
|
||||||
|
* MIT License
|
||||||
|
*/
|
||||||
|
//smooth-scroller.js
|
||||||
|
|
||||||
|
(function($) {
|
||||||
|
$.fn.smoothScroller = function(options) {
|
||||||
|
options = $.extend({}, $.fn.smoothScroller.defaults, options);
|
||||||
|
var el = $(this);
|
||||||
|
|
||||||
|
$(options.scrollEl).animate({
|
||||||
|
scrollTop: el.offset().top - $(options.scrollEl).offset().top - options.offset
|
||||||
|
}, options.speed, options.ease, function() {
|
||||||
|
var hash = el.attr('id');
|
||||||
|
|
||||||
|
if (hash.length) {
|
||||||
|
if (history.pushState) {
|
||||||
|
history.pushState(null, null, '#' + hash);
|
||||||
|
} else {
|
||||||
|
document.location.hash = hash;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
el.trigger('smoothScrollerComplete');
|
||||||
|
});
|
||||||
|
|
||||||
|
return this;
|
||||||
|
};
|
||||||
|
|
||||||
|
$.fn.smoothScroller.defaults = {
|
||||||
|
speed: 400,
|
||||||
|
ease: 'swing',
|
||||||
|
scrollEl: 'body,html',
|
||||||
|
offset: 0
|
||||||
|
};
|
||||||
|
|
||||||
|
$('body').on('click', '[data-smoothscroller]', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var href = $(this).attr('href');
|
||||||
|
|
||||||
|
if (href.indexOf('#') === 0) {
|
||||||
|
$(href).smoothScroller();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}(jQuery));
|
||||||
|
|
||||||
|
(function($) {
|
||||||
|
var verboseIdCache = {};
|
||||||
|
$.fn.toc = function(options) {
|
||||||
|
var self = this;
|
||||||
|
var opts = $.extend({}, jQuery.fn.toc.defaults, options);
|
||||||
|
|
||||||
|
var container = $(opts.container);
|
||||||
|
var headings = $(opts.selectors, container);
|
||||||
|
var headingOffsets = [];
|
||||||
|
var activeClassName = opts.activeClass;
|
||||||
|
|
||||||
|
var scrollTo = function(e, callback) {
|
||||||
|
if (opts.smoothScrolling && typeof opts.smoothScrolling === 'function') {
|
||||||
|
e.preventDefault();
|
||||||
|
var elScrollTo = $(e.target).attr('href');
|
||||||
|
|
||||||
|
opts.smoothScrolling(elScrollTo, opts, callback);
|
||||||
|
}
|
||||||
|
$('li', self).removeClass(activeClassName);
|
||||||
|
$(e.target).parent().addClass(activeClassName);
|
||||||
|
};
|
||||||
|
|
||||||
|
//highlight on scroll
|
||||||
|
var timeout;
|
||||||
|
var highlightOnScroll = function(e) {
|
||||||
|
if (timeout) {
|
||||||
|
clearTimeout(timeout);
|
||||||
|
}
|
||||||
|
timeout = setTimeout(function() {
|
||||||
|
var top = $(window).scrollTop(),
|
||||||
|
highlighted, closest = Number.MAX_VALUE,
|
||||||
|
index = 0;
|
||||||
|
|
||||||
|
for (var i = 0, c = headingOffsets.length; i < c; i++) {
|
||||||
|
var currentClosest = Math.abs(headingOffsets[i] - top);
|
||||||
|
if (currentClosest < closest) {
|
||||||
|
index = i;
|
||||||
|
closest = currentClosest;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$('li', self).removeClass(activeClassName);
|
||||||
|
highlighted = $('li:eq(' + index + ')', self).addClass(activeClassName);
|
||||||
|
opts.onHighlight(highlighted);
|
||||||
|
}, 50);
|
||||||
|
};
|
||||||
|
if (opts.highlightOnScroll) {
|
||||||
|
$(window).bind('scroll', highlightOnScroll);
|
||||||
|
highlightOnScroll();
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.each(function() {
|
||||||
|
//build TOC
|
||||||
|
var el = $(this);
|
||||||
|
var ul = $(opts.listType);
|
||||||
|
|
||||||
|
headings.each(function(i, heading) {
|
||||||
|
var $h = $(heading);
|
||||||
|
headingOffsets.push($h.offset().top - opts.highlightOffset);
|
||||||
|
|
||||||
|
var anchorName = opts.anchorName(i, heading, opts.prefix);
|
||||||
|
|
||||||
|
//add anchor
|
||||||
|
if (heading.id !== anchorName) {
|
||||||
|
var anchor = $('<span/>').attr('id', anchorName).insertBefore($h);
|
||||||
|
}
|
||||||
|
|
||||||
|
//build TOC item
|
||||||
|
var a = $('<a/>')
|
||||||
|
.text(opts.headerText(i, heading, $h))
|
||||||
|
.attr('href', '#' + anchorName)
|
||||||
|
.bind('click', function(e) {
|
||||||
|
$(window).unbind('scroll', highlightOnScroll);
|
||||||
|
scrollTo(e, function() {
|
||||||
|
$(window).bind('scroll', highlightOnScroll);
|
||||||
|
});
|
||||||
|
el.trigger('selected', $(this).attr('href'));
|
||||||
|
});
|
||||||
|
|
||||||
|
var li = $('<li/>')
|
||||||
|
.addClass(opts.itemClass(i, heading, $h, opts.prefix))
|
||||||
|
.append(a);
|
||||||
|
|
||||||
|
ul.append(li);
|
||||||
|
});
|
||||||
|
el.html(ul);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
jQuery.fn.toc.defaults = {
|
||||||
|
container: 'body',
|
||||||
|
listType: '<ul/>',
|
||||||
|
selectors: 'h1,h2,h3',
|
||||||
|
smoothScrolling: function(target, options, callback) {
|
||||||
|
$(target).smoothScroller({
|
||||||
|
offset: options.scrollToOffset
|
||||||
|
}).on('smoothScrollerComplete', function() {
|
||||||
|
callback();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
scrollToOffset: 0,
|
||||||
|
prefix: 'toc',
|
||||||
|
activeClass: 'toc-active',
|
||||||
|
onHighlight: function() {},
|
||||||
|
highlightOnScroll: true,
|
||||||
|
highlightOffset: 100,
|
||||||
|
anchorName: function(i, heading, prefix) {
|
||||||
|
if (heading.id.length) {
|
||||||
|
return heading.id;
|
||||||
|
}
|
||||||
|
|
||||||
|
var candidateId = $(heading).text().replace(/[^a-z0-9]/ig, ' ').replace(/\s+/g, '-').toLowerCase();
|
||||||
|
if (verboseIdCache[candidateId]) {
|
||||||
|
var j = 2;
|
||||||
|
|
||||||
|
while (verboseIdCache[candidateId + j]) {
|
||||||
|
j++;
|
||||||
|
}
|
||||||
|
candidateId = candidateId + '-' + j;
|
||||||
|
|
||||||
|
}
|
||||||
|
verboseIdCache[candidateId] = true;
|
||||||
|
|
||||||
|
return prefix + '-' + candidateId;
|
||||||
|
},
|
||||||
|
headerText: function(i, heading, $heading) {
|
||||||
|
return $heading.text();
|
||||||
|
},
|
||||||
|
itemClass: function(i, heading, $heading, prefix) {
|
||||||
|
return prefix + '-' + $heading[0].tagName.toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
@ -103,9 +103,15 @@
|
|||||||
@media (@screen-sm) {
|
@media (@screen-sm) {
|
||||||
padding: 6px 0;
|
padding: 6px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:active,
|
||||||
|
&:focus {
|
||||||
|
outline: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover,
|
a:hover,
|
||||||
|
a:focus,
|
||||||
.toc-active a {
|
.toc-active a {
|
||||||
color: @link-hover-color;
|
color: @link-hover-color;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user