Limited availability during the holidays

Another busy year is coming to its end, and an exciting year lies ahead. In order to get ready for a fresh new start, our team will spend a few days' rest during the winter holidays. Over the holiday break, we will have reduced staffing from December 20th, 2024, to January 5th, 2025, so please be patient if you do not receive a response as quickly as you normally would.

We send our warmest wishes for happiness, health, and success throughout the coming year. Thank you for your continued support, and may you have a peaceful and blessed Happy Holidays!

Okay
  Public Ticket #2213690
full size responsive
Closed

Comments

  • Gerardo started the conversation

    Hello!

    I want to make my "layerslider full size" responsive but this type is not responsive so in mobile is so huge, and the "responsive" one is not full size, not height: 100%.

    How can I get  a full size (width: 100% and height: 100%) responsive layeslider?

    Thanks!


  • [deleted] replied

    Hello Gerardo,

    Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.

    Please select the Full Size layout type and the Hero Scene mode for the slider. That way the slider will always match the height of the screen and not reach over it, filling the viewport completely, regardless of the device/size you are using.

  • Gerardo replied

    Hello Attila,

    I'm using now these specifications but in mobile its shows a full height screen as well. However in responsive is ok as you can see at the images.

  • [deleted] replied

    Unfortunately you cannot change a single slider's layout based on the device it's viewed on, so you can't show the slider fullscreen on desktop while changing it to normal responsive on mobiles.

    However, you can do this with separate sliders. 

    Basically, you build two sliders with different sizes or with different layouts for desktop and mobile. After that include them both to the page to the same location. And only display them on the required device/size by using the Hide over and Hide under options in the Slider Settings. 

    Usually these are the sizes for the breakpoints:
    desktop computers Screen width > 1024px
    tablets Screen width >= 768px and <= 1024px
    phones Screen with <= 767px