Okay
  Public Ticket #1304072
Mobile view of slider
Closed

Comments

  • oaltun started the conversation

    Hello,

    For our new site zurichphotoclub.com, I'm trying to design a slider like I have in genevaphotoclub page that I had built with fusion slider:

    https://www.genevaphotoclub.com/

    I made it look similar for desktop (while the fonts still seem too big):

    https://www.zurichphotoclub.com/en/

    But everything goes bad for mobile. For some reason, layerslider does not understand 50% from the side and leaves a huge gap in the left in mobile, as you can see attached. Also the canvas becomes too thin. 

    The mobile view of fusionbuilder looks way better, as it extends the canvas down and still manages the keep everything in the center.

    Could you tell me what kind of settings should I have to make this slider work like the fusion slider I had in genevaphotoclub? 

  • [deleted] replied

    Hey oaltun,

    I'd recommend that you build a full-width slider in this case with a rather small width, so the slider will be properly adjusted for mobiles as well. The width should be that large only, where the buttons and the text have just enough space in the slider.

  • oaltun replied

    Hi Atilla,

    Thanks for your answer. I'm not exactly clear on it though. What do you mean for example when you say "rather small width"? Should it be as wide as a mobile phone? I still want it to show full screen size on desktops? 

    Attached is the export of the slide settings. 

    Thanks in advance for your advice. 

  • [deleted] replied

    You should use a width value that contains your layers, so there are not much extra space around them in the slider. You can can use the preview window to test and set it up.

    This will only be the slider's original size, but your slider will take up the whole width of the browser regardless, since you are using the fullwidth layout. So it will still be scaled and resized accordingly, but the inner content is adjusted properly.