Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.
You can do that with the Hide over and Hide under options in the Slider Settings. But as I can see you're already using those options. If you're looking to prevent the slider from loading at all when it's not visible, unfortunately that's not possible. These options only hide the sliders on certain screen sizes, but the sliders still have to be loaded to the page, so when the screen size changes and they need to appear, the plugin can display them.
But LayerSlider offers multiple options (Advanced tab) that you can utilize to increase performance if that concerns you. The conditional script loading option will only load the scripts when they are needed. The include scripts in the footer option helps with eliminating the render-blocking scripts. The slider markup caching option spares server resources and lowers database connections. Please also note that the caching is not present for logged in admins, so you might not see the difference on the back-end. There is also the Optimize for mobile option in the Slider Settings -> Mobile tab (hidden by default).
Unfortunately at the moment this is the only option available in the plugin to hide/show sliders based on screen size/device. Please note that hidden sliders are not fully loaded, they only require minimal resource to run, so they will not generate large data or slower load times. They will only load their content when they are triggered by screen size.
Hi,
I have two sets of slides one for mobile and one for desktop,
I have formatted them so only mobile set appears under 740 width and visa versa,
I was wondering how I condition slides so they don't load above or below this width,
So as to prevent the mobile slides loading above 740 width and the desktop slides appearing below 740width, so the website load speed is optimised,
Kind Regards,
Julian
Hello Julian,
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.
You can do that with the Hide over and Hide under options in the Slider Settings. But as I can see you're already using those options. If you're looking to prevent the slider from loading at all when it's not visible, unfortunately that's not possible. These options only hide the sliders on certain screen sizes, but the sliders still have to be loaded to the page, so when the screen size changes and they need to appear, the plugin can display them.
But LayerSlider offers multiple options (Advanced tab) that you can utilize to increase performance if that concerns you. The conditional script loading option will only load the scripts when they are needed. The include scripts in the footer option helps with eliminating the render-blocking scripts. The slider markup caching option spares server resources and lowers database connections. Please also note that the caching is not present for logged in admins, so you might not see the difference on the back-end. There is also the Optimize for mobile option in the Slider Settings -> Mobile tab (hidden by default).
Thats pretty stupid,
Surely there is a custom CSS to block the slides from loading if they are not needed, defined by the load width resolution?
Unfortunately at the moment this is the only option available in the plugin to hide/show sliders based on screen size/device. Please note that hidden sliders are not fully loaded, they only require minimal resource to run, so they will not generate large data or slower load times. They will only load their content when they are triggered by screen size.