Main Navigation

RGen landing page use below structure for main navigation.

 

Sticky Navigation

Apply data-sticky=”y” as par given below code to make it navigation sticky by default.

 

Sticky On Scroll

Apply data-sticky-scroll=”y” to make it navigation sticky when page scroll only.

 

Mobile Menu & Logo

Below is example code to set logo image. Attributes data-navopen=”pe-7s-more” and data-navclose=”pe-7s-close” use to set icons for mobile menu.

 

Useful Classes

  • Apply CSS class .dark to display navigation dark background / on the image.
  • Use helper classes .bg-glass-dark-01, .bg-glass-dark-02, .bg-glass-dark-03, .bg-glass-dark-04, .bg-glass-dark-05, .bg-glass-dark-06, .bg-glass-dark-07, .bg-glass-dark-08, .bg-glass-dark-09, to apply transparent dark background on navigation.
  • Use helper classes .bg-glass-light-01, .bg-glass-light-02, .bg-glass-light-03, .bg-glass-light-04, .bg-glass-light-05, .bg-glass-light-06, .bg-glass-light-07, .bg-glass-light-08, .bg-glass-light-09, to apply transparent light background on navigation.

Related Articles