JS check for browser support

This commit is contained in:
alistair3149 2019-08-19 00:24:40 -04:00
parent bb78f97785
commit 9a58200117
2 changed files with 47 additions and 25 deletions

View file

@ -1,6 +1,7 @@
/* /*
* Scroll up Header * Scroll up Header
* Modified from https://codepen.io/sajjad/pen/vgEZNy * Modified from https://codepen.io/sajjad/pen/vgEZNy
* TODO: Convert to Vanilla JS
*/ */
// Hide header on scroll down // Hide header on scroll down

View file

@ -6,37 +6,58 @@
*/ */
const SmoothScroll = () => { const SmoothScroll = () => {
const navLinks = document.querySelectorAll('#toc a'); if (!'scrollBehavior' in document.documentElement.style) {
const navLinks = document.querySelectorAll('#toc a');
for (let n in navLinks) { for (let n in navLinks) {
if (navLinks.hasOwnProperty(n)) { if (navLinks.hasOwnProperty(n)) {
navLinks[n].addEventListener('click', e => { navLinks[n].addEventListener('click', e => {
e.preventDefault(); e.preventDefault();
document.querySelector(navLinks[n].hash) document.querySelector(navLinks[n].hash)
.scrollIntoView({ .scrollIntoView({
behavior: "smooth" behavior: "smooth"
}); });
}); });
}
}
} }
}
} }
const ScrollSpy = () => { const ScrollSpy = () => {
const sections = document.querySelectorAll('.mw-headline'); const sections = document.querySelectorAll('.mw-headline');
window.onscroll = () => { window.onscroll = () => {
const scrollPos = document.documentElement.scrollTop || document.body.scrollTop; const scrollPos = document.documentElement.scrollTop || document.body.scrollTop;
for (let s in sections) for (let s in sections)
if (sections.hasOwnProperty(s) && sections[s].offsetTop <= scrollPos) { if (sections.hasOwnProperty(s) && sections[s].offsetTop <= scrollPos) {
const id = mw.util.escapeIdForAttribute(sections[s].id); const id = mw.util.escapeIdForAttribute(sections[s].id);
document.querySelector('.active').classList.remove('active'); document.querySelector('.active').classList.remove('active');
document.querySelector(`a[href*="${ id }"]`).parentNode.classList.add('active'); document.querySelector(`a[href*="${ id }"]`).parentNode.classList.add('active');
} }
} }
} }
$(document).ready(function() { const CheckToC = () => {
SmoothScroll(); var ToC = document.getElementById("toc");
ScrollSpy(); if (toc) {
}); SmoothScroll();
ScrollSpy();
}
}
function ready(callbackFunc) {
if (document.readyState !== 'loading') {
CheckToC();
} else if (document.addEventListener) {
// All modern browsers to register DOMContentLoaded
document.addEventListener('DOMContentLoaded', callbackFunc);
} else {
// Old IE browsers
document.attachEvent('onreadystatechange', function() {
if (document.readyState === 'complete') {
CheckToC();
}
});
}
}