Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1086279

    Hey guys,

    is it possible to style the advanced layer-slider’s indicator circles/bullets like in this mockup by the client -> https://ibb.co/F6dG74n via some CSS?

    I already managed to style its sizing, position and colors in another project but I’m wondering how to get done A) the spacing between the circles and B) the positioning at the bottom border with 50% of the bullets actually overlapping the slider.

    Not sure if B) is possible at all with some Quick CSS but would be great if you could provide a simple solution :)

    Thx, Regards
    Michael

    #1086787

    Hey Michael,

    Could you post a link to where we can see the results you are getting please?

    Best regards,
    Rikard

    #1087249

    Hi Rikard,

    sure, website is Under Construction so pls check credentials in private content field below.

    Spacing between the circles plus alignment overlapping the slider would be the results needed.

    Thx, Regards
    Michael

    #1089344

    Hi,

    Thanks for the update.

    You can use this css code to move the slider dots downwards and outside the slider container.

    .avia-layerslider, .ls-fullscreen-wrapper, .ls-wp-container, .ls-wp-container .ls-gui-element, .ls-wp-container .ls-gui-element .ls-bottom-slidebuttons {
        overflow: visible !important;
    }
    
    #top div .avia-layerslider .ls-fullwidth .ls-bottom-slidebuttons {
        top: 13px !important;
    }

    Best regards,
    Ismael

    #1089524

    Cool, seems perfect, thanks Ismael! :)

    For those who are wondering, added this to size buttons and add margin between:

    #top .avia-layerslider .ls-bottom-slidebuttons a, #top .avia-layerslider .ls-nav-start, #top .avia-layerslider .ls-nav-stop {
    height: 40px;
    width: 40px;
    border-radius: 40px;
    margin: 0px 6px;
    }
    • This reply was modified 7 months, 1 week ago by  micscr.
    #1089759

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Layer Slider Navigation Bullets Styling (position + spacing)’ is closed to new replies.