I’d like this code to only effect certain pages with Layer Slides.
The code turns off layer slides for mobile, but not tablet.
Code:
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
.avia-layerslider {
display: none !important;
}
}
This matters because the home page still needs the layer sliders on mobile since there is more than one slide with text, title and button.
The pages that don’t need mobile layer sliders are because they are just one slide, styled to be color section headers for mobile.
I tried to edit the code thinking that “.avia-layerslider” was the ID that I could use to assign to certain layer sliders, but alas that did not work.
Help please! Thanks :)
You can reference this thread for how I got the code!
#122386
https://kriesi.at/support/topic/can-i-turn-off-the-layer-slider-on-mobile/
Hi,
If you need to not show it on all pages and still show it at the home page, then you can try something like this:
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
.page .avia-layerslider {
display: none;
}
.home .avia-layerslider {
display: block;
}
}
Best regards,
Rikard