-
AuthorPosts
-
January 21, 2025 at 3:28 pm #1475499
I’m having an issue with the Advanced Layerslider in the Enfold theme. The bottom of the slider is being cut off when the page initially loads. However, if I manually slide forward and backward, the slider displays correctly.
Here’s what I’ve tried so far to fix the issue:
Added margin and padding to ensure the entire slider is visible.
Applied an animation to the slider in hopes of triggering it to reload properly.
Unfortunately, the issue remains. Has anyone experienced a similar problem or found a solution to ensure the slider displays correctly on the initial page load?January 21, 2025 at 10:24 pm #1475515Hey snitt,
When I check your page I don’t see that your LayerSlider is cut off, I see that the content slider is cut off due to this error:
(index):875 Uncaught TypeError: Cannot read properties of undefined (reading 'isMobile')
from this custom code in your functions.php:add_action('wp_footer', 'ava_auto_height'); function ava_auto_height(){ ?> <script> (function($){ function c() { if( $.avia_utilities.isMobile ) return; $('#content-slider-height-same .slide-entry').css('height', ''); var elementHeights = $('#content-slider-height-same .slide-entry').map(function() { return $(this).outerHeight(); }).get(); var maxHeight = Math.max.apply(null, elementHeights); $('#content-slider-height-same .slide-entry').height(maxHeight); } $(window).on('load', function() { c(); }).load(); })(jQuery); </script> <?php }
Is this what you are talking about?
Changing to this seems to solve after your WP Rocket plugin is cleared:add_action('wp_footer', 'ava_auto_height'); function ava_auto_height(){ ?> <script> (function($){ function c() { //if( $.avia_utilities.isMobile ) return; $('#content-slider-height-same .slide-entry-excerpt').css('height', ''); var elementHeights = $('#content-slider-height-same .slide-entry-excerpt').map(function() { return $(this).outerHeight(); }).get(); var maxHeight = Math.max.apply(null, elementHeights); $('#content-slider-height-same .slide-entry-excerpt').height(maxHeight); } $(window).on('load', function() { c(); }).load(); })(jQuery); </script> <?php }
I set your code back to the way you had it, please check.Best regards,
MikeJanuary 23, 2025 at 11:42 am #1475639Hi Mike,
Thank you for the great help :)
Yes that’s the issue I’m having. It cuts off at the bottom, so the price boxes don’t show.
I can see that the issue is solved in browsers like safari and opera, but not always in chrome.If I refresh in chrome (inkognito), sometimes it works and sometimes not. Any idea why?
January 23, 2025 at 10:41 pm #1475688Hi,
Please try disabling your WP Rocket plugin and disable Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression and enable Enfold Theme Options ▸ Performance ▸ Delete old CSS and JS files and clear any CDN and server cache that you may have enabled. This may that 24 hours to clear.
Then clear your browser cache and check.Best regards,
MikeJanuary 24, 2025 at 1:38 pm #1475731Hi Mike,
WP Rocket was disabled and the settings for merging and compression were already disabled,
but I’ve deleted the old files and emptied all cache including server. Will wait and see if that solves it. Thank you :)January 24, 2025 at 6:19 pm #1475752 -
AuthorPosts
- You must be logged in to reply to this topic.