| @@ -24,12 +24,13 @@ | ||
| 24 | 24 | if ( ! $this->is_lazy_load_background_images_enabled() ) { |
| 25 | 25 | return; |
| 26 | 26 | } |
| 27 | 27 | |
| 28 | + if ( ! $this->should_lazy_load_background_images() ) { | |
| 29 | + return; | |
| 30 | + } | |
| 31 | + | |
| 28 | 32 | add_action( 'wp_head', function() { |
| 29 | - if ( ! $this->should_lazy_load_background_images() ) { | |
| 30 | - return; | |
| 31 | - } | |
| 32 | 33 | ?> |
| 33 | 34 | <style> |
| 34 | 35 | .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload), |
| 35 | 36 | .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload) * { |
| @@ -51,39 +52,34 @@ | ||
| 51 | 52 | <?php |
| 52 | 53 | } ); |
| 53 | 54 | |
| 54 | 55 | add_action( 'wp_footer', function() { |
| 55 | - if ( ! $this->should_lazy_load_background_images() ) { | |
| 56 | - return; | |
| 57 | - } | |
| 58 | 56 | ?> |
| 59 | 57 | <script> |
| 60 | - ( () => { | |
| 61 | - const lazyloadRunObserver = () => { | |
| 62 | - const lazyloadBackgrounds = document.querySelectorAll( `.e-con.e-parent:not(.e-lazyloaded)` ); | |
| 63 | - const lazyloadBackgroundObserver = new IntersectionObserver( ( entries ) => { | |
| 64 | - entries.forEach( ( entry ) => { | |
| 65 | - if ( entry.isIntersecting ) { | |
| 66 | - let lazyloadBackground = entry.target; | |
| 67 | - if( lazyloadBackground ) { | |
| 68 | - lazyloadBackground.classList.add( 'e-lazyloaded' ); | |
| 69 | - } | |
| 70 | - lazyloadBackgroundObserver.unobserve( entry.target ); | |
| 58 | + const lazyloadRunObserver = () => { | |
| 59 | + const lazyloadBackgrounds = document.querySelectorAll( `.e-con.e-parent:not(.e-lazyloaded)` ); | |
| 60 | + const lazyloadBackgroundObserver = new IntersectionObserver( ( entries ) => { | |
| 61 | + entries.forEach( ( entry ) => { | |
| 62 | + if ( entry.isIntersecting ) { | |
| 63 | + let lazyloadBackground = entry.target; | |
| 64 | + if( lazyloadBackground ) { | |
| 65 | + lazyloadBackground.classList.add( 'e-lazyloaded' ); | |
| 71 | 66 | } |
| 72 | - }); | |
| 73 | - }, { rootMargin: '200px 0px 200px 0px' } ); | |
| 74 | - lazyloadBackgrounds.forEach( ( lazyloadBackground ) => { | |
| 75 | - lazyloadBackgroundObserver.observe( lazyloadBackground ); | |
| 76 | - } ); | |
| 77 | - }; | |
| 78 | - const events = [ | |
| 79 | - 'DOMContentLoaded', | |
| 80 | - 'elementor/lazyload/observe', | |
| 81 | - ]; | |
| 82 | - events.forEach( ( event ) => { | |
| 83 | - document.addEventListener( event, lazyloadRunObserver ); | |
| 67 | + lazyloadBackgroundObserver.unobserve( entry.target ); | |
| 68 | + } | |
| 69 | + }); | |
| 70 | + }, { rootMargin: '200px 0px 200px 0px' } ); | |
| 71 | + lazyloadBackgrounds.forEach( ( lazyloadBackground ) => { | |
| 72 | + lazyloadBackgroundObserver.observe( lazyloadBackground ); | |
| 84 | 73 | } ); |
| 85 | - } )(); | |
| 74 | + }; | |
| 75 | + const events = [ | |
| 76 | + 'DOMContentLoaded', | |
| 77 | + 'elementor/lazyload/observe', | |
| 78 | + ]; | |
| 79 | + events.forEach( ( event ) => { | |
| 80 | + document.addEventListener( event, lazyloadRunObserver ); | |
| 81 | + } ); | |
| 86 | 82 | </script> |
| 87 | 83 | <?php |
| 88 | 84 | } ); |
| 89 | 85 | } |