Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #791061

    HI, I have a layered slider on my home.
    I would like that on mobiles the slider occupies nearly all the screen. Is that possible?

    I´m sending you a screenshot of my web on mobile.

    Thanks!!

    #791090

    Hey cipriana,

    I think that would be very difficult, but maybe you can create a new slider and show that for mobile screens only?

    Best regards,
    Rikard

    #791109

    ok, and how can I show that slider only on mobiles?
    Should I add some code in quick css?
    Could you tell me which code?

    thanks!!

    #791115

    Hi,

    Edit: If you received my previous reply, please disregard. Accidentally posted on wrong thread :)
    Please refer to this post – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/ and try switching your slider on mobile with a one that was optimized for mobile

    Best regards,
    Yigit

    • This reply was modified 7 years, 6 months ago by Yigit.
    #793005

    Hi, I´ve tried to do what the post says but where specifically should I add the custom CSS class in the Layer Slider? In ID section? In Custom CSS? In Attribute name?

    I´ve added the Custom CSS class in all of these sections, and added this code in Quick CSS
    @media only screen and (max-width: 990px) {
    .only-desktop { display: none !important; }}

    but nothing happens.

    Could you give me a hint?
    Thanks!

    #793149

    Hi,

    You can use the LayerSlider ID to target it, but we would need to see the actual slider in order to find that out. Could you post a link to your site please?

    Best regards,
    Rikard

    #793258

    Yes, here you have.

    thanks

    #793281

    Hi!

    Please try this code instead:

    @media only screen and (max-width: 990px) {
       .home #layer_slider_1 { display: none !important; }
    }
    

    Best regards,
    Sarah

    #793286

    Hi Sarah, thanks

    Now, I have two layer sliders (ID:1 and ID:4)

    I´ve added this code in quick CSS

    @media only screen and (max-width: 990px) {
    .home #layer_slider_1 { display: none !important; }
    }
    @media only screen and (min-width: 990px) {
    .home #layer_slider_4 { display: none !important; }
    }
    I´ve created two layers sliders sections in my home, one with LayerSlider 1, for desktops) and the other with Layer Slider 4 (for mobiles)
    It´s Ok on mobiles, but in desktop I´m seeing both sliders.
    What I´m doing wrong?

    Thank you very much!

    #793290

    Hi,

    I can’t see #layer_slider_4, actually. Did you remove it?
    Best regards,
    Sarah

    #793419

    Yes, I´ve removed it but the problems remains.
    Thanks

    #793665

    Hi!

    Your code should work if the IDs are correct. Can you try putting it back so we can take a closer look?
    Best regards,
    Sarah

    #793806

    Ok, I´ve added the code again. And the two sliders in home.
    But in desktops I´m seeing two sliders.

    Thanks!

    • This reply was modified 7 years, 6 months ago by cipriana.
    #793814

    Hi,

    The ID is layerslider_4. Please try this code instead:

    @media only screen and (max-width: 990px) {
    .home #layer_slider_1 { display: none !important; }
    }
    @media only screen and (min-width: 990px) {
    .home #layerslider_4 { display: none !important; }
    }

    Best regards,
    Sarah

    #793816

    Oh! now yes!
    thank you very much Sarah!

    #793820

    You’re very welcome! We’re glad to help.

    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you.

    Cheers!
    Sarah

Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘Home view on mobile’ is closed to new replies.