fbpx
Welcome, Guest
Username: Password: Remember me

TOPIC: (SOLVED) Sticky mega menu

Sticky mega menu 4 years 8 months ago #2178

  • datapro
  • datapro's Avatar
  • Offline
  • New Member
  • Posts: 2
  • Thank you received: 1
  • Karma: 0
How can i add sticky funcion to the mega menu, thx
The administrator has disabled public write access.

Sticky mega menu 4 years 8 months ago #2179

  • chandandeep
  • chandandeep's Avatar
  • Offline
  • Administrator
  • Posts: 4614
  • Thank you received: 652
  • Karma: 116
Hi,

Add JS Script in script.js file.

jQuery(document).ready(function(){
	jQuery(window).scroll(function() {    
    var scroll = jQuery(window).scrollTop();
    if (scroll >= 60) {
        jQuery("#t3-header").addClass("scroll");
    }
	if (scroll <= 60) {
        jQuery("#t3-header").removeClass("scroll");
    }
	})
});

Add CSS in template.less file

#t3-header.scroll {
    position: fixed !important;
}

Path:
templates/TEMPLATENAME/js
templates/TEMPLATENAME/less

Thanks
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.

To know more about products check out the their documentation.
The administrator has disabled public write access.
The following user(s) said Thank You: datapro

Sticky mega menu 4 years 8 months ago #2181

  • datapro
  • datapro's Avatar
  • Offline
  • New Member
  • Posts: 2
  • Thank you received: 1
  • Karma: 0
That worked for me.. thank you for the quick response.
The administrator has disabled public write access.
The following user(s) said Thank You: chandandeep

Sticky mega menu 4 years 8 months ago #2183

  • chandandeep
  • chandandeep's Avatar
  • Offline
  • Administrator
  • Posts: 4614
  • Thank you received: 652
  • Karma: 116
Let us know if you have any question for us.

Thanks,
Chandan
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.

To know more about products check out the their documentation.
The administrator has disabled public write access.

Sticky mega menu 4 years 8 months ago #2330

  • Web4star
  • Web4star's Avatar
  • Offline
  • Premium Member
  • Posts: 132
  • Thank you received: 1
  • Karma: 1
Hello JD, I really appreciate you guys for all the free joomla templates. I followed the steps for sticky menu and it worked.

But please, how can I change the font size and also the color of menu items to black when it sticks just like your site....

Also, I wanted to add icons to menu items, how can I achieve that.

Thanks so much in advance.
Attachments:
The administrator has disabled public write access.

Sticky mega menu 4 years 8 months ago #2341

  • rahulahluwalia
  • rahulahluwalia's Avatar
Hello,

Please add the code given below in "template.less"
#t3-header.scroll{
    .navbar-default{
        .navbar-nav > {
            .active{
                a{
                    color:Put Your Active Color Code Here;
                }
            }
            li >{
                a{
                    color:Put Your Normal Color Code Here;
                }
            }
        }
    }
}

For adding icons to the main menu:
1- login to the Joomla backend
2- In template manager... under Mega menu tab please add the icons you need to follow the set of instructions presented as a tooltip (when you mouse over on the labels a small box will pop up with the instructions on it.)
Screenshot:
www.screencast.com/t/HLscpNEH
The administrator has disabled public write access.
Moderators: chandandeep
Time to create page: 0.426 seconds
Cron Job Starts