BuddyDev

Search

header navi background design

  • Participant
    Level: Initiated
    Posts: 2
    IMZ on August 19, 2020 at 7:59 am #32581

    https://flatsome3.uxthemes.com/demos/shop-demos/sport-shop/

    I want a setting that allows the header to be transparent, like this theme.

  • Keymaster
    (BuddyDev Team)
    Posts: 24593
    Brajesh Singh on August 20, 2020 at 7:10 am #32604

    Hi Sunny,
    Thank you for the question.

    You can do it by using some extra css. It will need a lot of changes for colors etc.

    The basic Idea is
    1. Make header absolutely positioned and add a margin to body and set header background transparent
    2. On scroll, when sticky-header class is added, set header background to some translucent color.

    That does it.

    The challenges you will face is related to the visibility/readability of the navigation links.

    Regards
    Brajesh

You must be logged in to reply to this topic.

This topic is: not resolved