Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.

Okay
  Public Ticket #1376233
Menu Transition Effect
Closed

Comments

  • Naveed started the conversation

    Hello Support,

    I'm developing the site using TheGem theme and just configured the menu. I have 2 questions:

    1. I want to hide the menu on home page and when I scroll down the menu should appear with transition. 
    2. The current menu is fine but when it gets sticky it does shows any smooth transition.
  •  7,092
    Oliver replied

    HI!

    Sorry, can you provide the wp-admin access and add some screenshots to describe this issues in detail? Thank you. 

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Naveed replied

    Well I'm configuring the theme on my local machine so I can't provide the URL.

    I have want to hide the menu on Home Page and when the user scrolls  the menu should appear from the top with slide effect.


  • Naveed replied

    Here is the video to understand what I want to do with this theme. My old theme support this but I like TheGem to continue my new site development.

  •  7,092
    Oliver replied

    HI!

    pls. use following css:

    #page .site-header-wrapper-transparent #site-header:not(.shrink) {
        display: none;
    }

     

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Naveed replied

    Hello Gregor, I have used this css to get the desired effect please check if this is OK and not going to effect any other stuff and this effect will only be added on homepage only other page will have same menu.

    #site-header {
        opacity: 0;
        transition: all 0.5s ease;
    }
    #site-header.fixed {
        opacity: 1;
        transition: all 0.5s ease;
    }

  •  7,092
    Oliver replied

    HI!

    yes, working.  If you need to apply this code only on the one page you can add css to the custom css filed on the page:

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Naveed replied

    Yes Gregor, I have added it on page level css and it's working fine.

    By the way theme is great.

  •  7,092
    Oliver replied

    Thank you!

    It would be great if you could rate us on ThemeForest.  Just go to your downloads on ThemeForest ( https://themeforest.net/downloads ), find TheGem and then you can rate it here 

    We would very appreciate your rating!

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Naveed replied

    Done, you guys deserve more than 5-stars.

  •  7,092
    Oliver replied

    Thank you so much and feel free to contact us if you need help.

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver