Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #485694

    Is it possible to make the same effects on the header and menu on mobile version as it does on the mobile version of this website http://www.npgroup.net ?
    if so what would be the CSS code?

    • This topic was modified 3 years, 6 months ago by  jorge42189.
    #485838

    Hey jorge42189,

    We will have to inspect your page in order to give you custom CSS, could you post it please?

    Regards,
    Rikard

    #485951

    Hi Rikard

    Sure not a problem

    #486450

    Hi!

    which effects do you mean exactly? please elaborate and explain/show us what you need.

    Regards,
    Andy

    #493795

    Hi,

    Please go to http://www.npgroup.net from a mobile device and see how their menu opens and close and also the way the menu icon opens and close, is it possible to create that same feature for the mobile version on the enfold theme? I would also like the header on mobile to be transparent as shown on the mobile version of npgroup.com

    Thank you,

    • This reply was modified 3 years, 5 months ago by  jorge42189.
    #494506

    Hello!

    The icon thing would definitely require some custom work, i’m pretty sure you can find some tutorials regarding that in Google.

    On the other hand you can use the following CSS code to change the way the actual menu opens/closes (it will Fade):

    #mobile-advanced{
    	-webkit-transform:   scale(1);
    	-moz-transform:      scale(1);
    	transform:           scale(1);
    }
    .avia_transform3d #mobile-advanced{
    	-webkit-transform:   scale3d(1);
    	-moz-transform:      scale3d(1);
    	transform:           scale3d(1);
    }
    .show_mobile_menu #mobile-advanced{
    	-webkit-transform:   scale(1);
    	-moz-transform:      scale(1);
    	transform:           scale(1);
    }
    .avia_transform3d .show_mobile_menu #mobile-advanced{
    	-webkit-transform:   scale3d(1);
    	-moz-transform:      scale3d(1);
    	transform:           scale3d(1);
    }
    
    #mobile-advanced{ 
    	right: auto;
    	top: auto;
    	opacity: 0;
    	transition: all linear 0.1s;
    }
    
    .show_mobile_menu #mobile-advanced{
        opacity: 1;
    	-webkit-transform:   none;
    	-moz-transform:      none;
    	transform:           none;
    }
    
    .avia_transform3d .show_mobile_menu #mobile-advanced{
    	-webkit-transform:   none;
    	-moz-transform:      none;
    	transform:           none;
    }

    Cheers!
    Josue

    #495187

    NICE! thank you Josue :-)

    #495292

    You are welcome, glad to help :)

    Regards,
    Josue

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

You must be logged in to reply to this topic.