PluginProbe
Easy Elements for Elementor – Addons & Website Templates / 1.5.0
Easy Elements for Elementor – Addons & Website Templates v1.5.0
1.5.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.6 1.4.7 1.4.8 1.4.5 1.4.4 1.4.3 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.7 1.3.8 1.3.9 1.4.0 All 47 releases
easy-elements / widgets / single-nav / js / eel-sticky-header.js

eel-sticky-header.js in Easy Elements for Elementor – Addons & Website Templates 1.5.0, at widgets/single-nav/js/eel-sticky-header.js

97 lines 2.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 (function($) {
2 function initStickyHeaderScript($scope) {
3 // Skip on mobile — the margin-top mutation on scroll causes layout
4 // shift that delays Elementor's IntersectionObserver, making motion
5 // fx widgets load late.
6 if (window.innerWidth < 768) return;
7
8 var header = $('header.easy-site-header');
9 var page = $('#page');
10 var topbar = $('.entro-topbar-sticky-hide-yes');
11 var isFixedHeader = $('body').is('.easyel-fixed-header, .rivora-sidebar-menu');
12
13 if (!header.length || !page.length) {
14 return;
15 }
16
17 //header.addClass("eel-sticky-header-on");
18
19 function updatePaddingAndMargin(scrollDirection, scroll) {
20 var headerHeight = header.outerHeight();
21 var topbarHeight = topbar.length ? topbar.outerHeight() : 0;
22 var isTopSticky = header.hasClass('eel-fixed-top-sticky');
23
24 // page padding-top
25 if (typeof eelStickyHeaderSettings !== 'undefined' && eelStickyHeaderSettings.enablePadding) {
26 if (!isFixedHeader) {
27 page.css('padding-top', headerHeight + 'px');
28 } else {
29 page.css('padding-top', '');
30 }
31 }
32
33 // fixed-top-sticky
34 if (isTopSticky) {
35 if (scroll > 0) {
36 header.addClass('eel--fixed-top-sticky');
37 header.css('margin-top', `-${topbarHeight}px`);
38 } else {
39 header.removeClass('eel--fixed-top-sticky');
40 header.css('margin-top', '0px');
41 }
42 return;
43 }
44
45 // sticky behavior
46 if (header.hasClass('eel-up-scroll')) {
47 header.css('margin-top', `-${topbarHeight}px`);
48 } else {
49 header.css('margin-top', '0px');
50 }
51 }
52
53 let lastScroll = 0;
54 const stickyScrollThreshold = 50;
55
56 function sticky_header() {
57 let scroll = $(window).scrollTop();
58 let isTopSticky = header.hasClass('eel-fixed-top-sticky');
59 let scrollDirection = scroll > lastScroll ? 'down' : 'up';
60
61 if (isTopSticky) {
62 header.addClass('eel-sticky-header');
63 updatePaddingAndMargin(scrollDirection, scroll);
64 lastScroll = scroll;
65 return;
66 }
67
68 if (scroll > stickyScrollThreshold) {
69 header.addClass('eel-sticky-header');
70 if (scroll > lastScroll) {
71 header.removeClass('eel-up-scroll').addClass('eel-down-scroll');
72 } else {
73 header.removeClass('eel-down-scroll').addClass('eel-up-scroll');
74 }
75 } else {
76 header.removeClass('eel-sticky-header eel-up-scroll eel-down-scroll');
77 }
78
79 updatePaddingAndMargin(scrollDirection, scroll);
80 lastScroll = scroll;
81 }
82
83 $(document).ready(function() {
84 updatePaddingAndMargin('up', 0);
85 sticky_header();
86 });
87
88 $(window).on('scroll resize', function() {
89 sticky_header();
90 });
91 }
92
93 $(window).on('elementor/frontend/init', function() {
94 elementorFrontend.hooks.addAction('frontend/element_ready/global', initStickyHeaderScript);
95 });
96 })(jQuery);
97