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 #3341938
Resize Image Layers on Mobile
Closed

Comments

  • Silvio started the conversation

    Hello, I'm trying type = fullsize but I find a problem on mobile devices.

    The configuration is the following:
    $('#layerslider').layerSlider({
    skinsPath: '/lib/layerslider/skins/',
    skin: 'v6',
    type: 'fullsize',
    fullSizeMode: 'hero',
    globalBGColor: '#c224a0',
    globalBGImage: '/images/slider/TA2288.JPG',
    globalBGSize: 'cover',
    navStartStop: true,
    navPrevNext: true,
    navButtons: false,
    hoverPrevNext: false,
    hoverBottomNav: false,
    showBarTimer: true,
    showCircleTimer: false,
    showSlideBarTimer: false,
    autoStart: true,
    hideOnMobile: false,
    });
    The problem is that on mobile devices the images of the layers do not resize, they are keeping the original size.
    In debug mode I see these warnings:
    INITIAL SLIDER STYLE
    Neighter initial width nor layersContainerWidth width specified!
    Setting slider width to element.clientWidth (360px).
    Neighter initial height nor layersContainerHeight specified!
    Setting slider height to element.parent.clientHeight (1284px).
    Slider type is "fullsize" and it has no layersContainerWidth property specified!
    Setting layersContainerWidth to sliderWidth (360px).
    Slider type is "fullsize" and it has no layersContainerHeight property specified!
    Saving layersContainerHeight to sliderHeight (0px).
    Notice this last line. Could it be that this is causing the layer images to not resize as expected?
    How can I solve that?
    Thank you

  • Silvio replied

    Edit:

    When I start on PC wide screen (1280px) and open the navigator console (chrome) and click on "Toogle device toolbar", navigator show preview mobile simulator, there layers images resize right, that's layerslider started on a screen width of 1280px. But if I do F5 to refresh and starting layerslider again (starting on 360px width), the problem is there, layers images doesn't resized.

  •  138
    George replied

    Hello Silvio,

    Please add an initial width and height (in pixels) to your project (you can use the style attribute for that on the slider element or the width / height option in the init code.

    Best Regards,
    George | Kreatura Dev Team