Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • May 31, 2017 at 5:05 pm #802107
    Krissieg

    Hi guys,

    I know this is unlikely to do but it’s worth asking…
    My client likes how the fullwidth easy slider fills a mobile screen versus the layerslider WP but the image doesn’t look very good when in mobile version as the logo within the image doesn’t sit right. Is there anyway I can swap the image to something else when the pixel width gets down to a mobile size?

    I’m guessing this is going into the realm of complicated but I wanted to see if you have any advice or ideas on how I can get around it?
    See the website: http://serviceintegrators.co.uk/
    Desktop it looks fine, and tablet. but when in mobile, the logo gets cut off and hidden behind the wording. I can’t move the logo up any more otherwise it will look silly on the desktop version. I would use layerslider WP for more control but we don’t like how it shrinks to scale on mobile and everything looks small.

    Thanks!

    • This topic was modified 7 years, 6 months ago by Krissieg.
    May 31, 2017 at 6:10 pm #802127
    Yigit

    Hey Krissie,

    You can refer to this post – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/ and choose to hide your slider on mobile and display another one. That would be easiest way :)

    Best regards,
    Yigit

    June 1, 2017 at 11:53 am #802492
    Krissieg

    Cool. So would I copy the slider on the same page? Add the code and then the correct one will display depending on the device being used?
    Also, is there any way of adjusting the text block on the sliders, so I can move them up a bit? http://prntscr.com/felbxs

    Thanks

    June 1, 2017 at 12:47 pm #802515
    Krissieg

    Ok i’ve done it but I’m not sure how big to make the mobile background image? What do you recommend?

    June 1, 2017 at 1:28 pm #802530
    Krissieg

    One more thing.. how do I make the font in the text block bigger? I’ve changed the size manually but it still stays small when viewed on mobile.

    June 1, 2017 at 1:44 pm #802538
    Krissieg

    When I look at the website within a tablet the menu is cramped. http://prntscr.com/feml4l
    Please can you let me know if I can change these settings to 1024?
    http://prntscr.com/femkut

    Thanks

    June 1, 2017 at 2:07 pm #802546
    Krissieg

    @media only screen and (max-width: 1100px) {
    .av-main-nav > li > a { padding: 0 7px; }
    }
    I used this code, but it doesn’t seem to get the menu to change when a tablet screen is 1024 width. Please can you have a look?

    Service Integrators

    Thanks

    June 4, 2017 at 7:09 pm #803672
    Mike

    Hi,
    Has this been solved? I don’t see the mobile menu issue.

    Best regards,
    Mike

    June 13, 2017 at 12:30 pm #807404
    Krissieg

    Hi Mike, no not yet.
    I’m waiting for help with the tablet view.

    June 14, 2017 at 5:49 am #807776
    Rikard

    Hi,

    Please try this in Quick CSS:

    @media only screen and (max-width: 1024px) {
nav.main_menu {
  display:none !important;
}
#advanced_menu_toggle, #advanced_menu_hide {
  display:block !important;
}
}

    Best regards,
    Rikard

    June 14, 2017 at 10:53 am #807901
    Krissieg

    Great, sorted! Thanks very much!

    June 14, 2017 at 9:19 pm #808222
    Nikko

    Hi,

    Glad that it’s fixed. Thanks for using Enfold :)

    Best regards,
    Nikko

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Mobile version of fullwidth easy slider’ is closed to new replies.