Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • January 27, 2016 at 12:09 am #572461
    shefferz

    Hello,

    I am using a full width easy slider for a page introduction with text in the image.

    However once the screen width hits ~740px the slider becomes unreadable and unproportional to the screen.

    I want the slider there on desktop versions, however I want it to disappear and have a different slider take its place with a different picture that is mobile friendly once it hits the ~740px width.

    January 27, 2016 at 2:29 am #572500
    Elliott

    Hey shefferz!

    Add this to a codeblock element in the page.

    <style type = "text/css">
@media screen (max-width: 740px) {
#full_slider_1 { display: none  !important; }
#full_slider_2 { display: block !important; }
}
#full_slider_1 { display: block; }
#full_slider_2 { display: none; }
</style>

    Best regards,
    Elliott

    • This reply was modified 8 years, 2 months ago by Elliott.
    January 27, 2016 at 11:18 am #572740
    shefferz

    Hi Elliot thanks for the response, however the code isn’t working. Is there a specific place i need to put the code block in the page?

    January 27, 2016 at 11:19 am #572742
    shefferz

    Also is there a way I can control this from my stylesheet instead of hard coding the page?

    January 27, 2016 at 7:41 pm #573219
    Yigit

    Hi!

    Please refer to this post – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/

    Regards,
    Yigit

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.