Skip to content

Instantly share code, notes, and snippets.

@ritcheyer
Last active June 9, 2017 00:43
Show Gist options
  • Save ritcheyer/8976435fe60b7f0b9863e8736973ab2f to your computer and use it in GitHub Desktop.
Save ritcheyer/8976435fe60b7f0b9863e8736973ab2f to your computer and use it in GitHub Desktop.
window.onload = function() {
var tslaBodyTag = document.body,
tslaMenuMask = document.getElementById('tsla-header-mask'),
tslaMenuHeader = document.getElementById('tsla-header-main'),
tslaMenuCheckbox = document.getElementById('tsla-header-main--trigger'),
tslaHeaderCheckboxes = document.getElementsByClassName('tsla-header-checkbox');
window.addEventListener('resize', tslaResize);
// if the browser window is greater than or equal to 640, uncheck checkboxes
function tslaResize() {
if (window.innerWidth >= 640) {
uncheckCheckboxes(tslaHeaderCheckboxes);
}
}
// uncheck all the checkboxes
function uncheckCheckboxes(elements) {
if(elements.length) {
for (var i = 0; i < elements.length; i++) {
elements[i].checked=false;
}
}
}
// if user clicks on the 'mask', uncheck all the checkboxes
tslaMenuMask.addEventListener('click', function() {
if (tslaMenuCheckbox.checked) {
uncheckCheckboxes(tslaHeaderCheckboxes);
tslaBodyTag.classList.remove('tsla-prevent-scroll');
}
});
// if user clicks on the menu opener, add/remove a class to the body tag
tslaMenuCheckbox.addEventListener('click', function() {
if (tslaMenuCheckbox.checked) {
tslaBodyTag.classList.add('tsla-prevent-scroll');
} else {
tslaBodyTag.classList.remove('tsla-prevent-scroll');
}
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment