ayrisdev/muglasurucukursu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: optimize sticky header to prevent layout thrashing

Browse Source
This commit is contained in:
mstfyldz
2026-05-04 22:23:42 +03:00
parent ae2153d744
commit 2d5a7f4048
1 changed files with 20 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
js/function.js
View File

@@ -11,20 +11,30 @@
/* Sticky Header */ /* Sticky Header */
if($('.active-sticky-header').length){ if($('.active-sticky-header').length){
$window.on('resize', function(){ var $headerSticky = $('header .header-sticky');
setHeaderHeight(); var $headerMain = $("header.main-header");
}); var cachedHeight = 0;
function setHeaderHeight(){ function setHeaderHeight(){
$("header.main-header").css("height", $('header .header-sticky').outerHeight()); cachedHeight = $headerSticky.outerHeight();
$headerMain.css("height", cachedHeight);
} }
$window.on("scroll", function() { $window.on('load resize', function(){
var fromTop = $(window).scrollTop();
setHeaderHeight(); setHeaderHeight();
var headerHeight = $('header .header-sticky').outerHeight() });
$("header .header-sticky").toggleClass("hide", (fromTop > headerHeight + 100));
$("header .header-sticky").toggleClass("active", (fromTop > 600)); var ticking = false;
$window.on("scroll", function() {
if (!ticking) {
window.requestAnimationFrame(function() {
var fromTop = $window.scrollTop();
$headerSticky.toggleClass("hide", (fromTop > cachedHeight + 100));
$headerSticky.toggleClass("active", (fromTop > 600));
ticking = false;
});
ticking = true;
}
}); });
} }