Skip to content

Instantly share code, notes, and snippets.

@wibawasuyadnya
Last active July 26, 2022 02:30
Show Gist options
  • Save wibawasuyadnya/6ebdfece773da160eaf2c48c3dc03d82 to your computer and use it in GitHub Desktop.
Save wibawasuyadnya/6ebdfece773da160eaf2c48c3dc03d82 to your computer and use it in GitHub Desktop.
const headerSticky = document.querySelector('#stickyheaders');
const headerUP = document.querySelector('.headerup');
const styles = {
sticky: {
transition : 'transform 0.34s ease'
},
up: {
transform: 'translateY(-80px)'
},
};
const getStyles = obj => Object.keys(obj).map(key => `${key}:${obj[key]}`).join(';');
// assign directly to cssText
headerSticky.style.cssText = getStyles(styles.sticky);
headerUP.style.cssText = getStyles(styles.up);
document.addEventListener('DOMContentLoaded', function() {
jQuery(function($) {
var mywindow = $(window);
var mypos = mywindow.scrollTop();
let scrolling = false; /* For throlling scroll event */
window.addEventListener('scroll', function() {
scrolling = true;
});
setInterval(() => {
if (scrolling) {
scrolling = false;
if (mypos > 40) {
if (mywindow.scrollTop() > mypos) {
$('#stickyheaders').addClass('headerup');
} else {
$('#stickyheaders').removeClass('headerup');
}
}
mypos = mywindow.scrollTop();
}
}, 300);
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment