Genesis Themes

  • Home
  • Genesis Tutorials
  • WP Tutorial
  • Twenty Fifteen Theme
  • Social Media
  • WP Plugins

Highlight Current Menu Item Using jQuery

jQuery to highlight Active menu item :

Menu is a common web design technique,where every website displays menu items.If user active on specific menu,them show that menu item differently bu using jQuery.There are many jQuery plugins are available to highlight current menu item and page.The problem with plugins are,they may slow down your website speed.

The possible solution,the below listed jQuery highlight active menu item in your website.When a user visits a page,jQuery helps to highlight active menu item based on URL.This techniques works for both absolute and relative URLs.

<script type="text/javascript">
    jQuery(document).ready(function($){
     // Get current url
     // Select an a element that has the matching href and apply a class of 'active'.
     var url = window.location.href;
     $('.menu a[href="'+url+'"]').addClass('current_page_item');
    });
</script>

Related Posts

  • Custom CSS Media Queries for IOS Devices
  • Add Click to Call Phone Number Link With HTML5
  • How to Find CodeCanyon ThemeForest Purchase Code
  • No Self Pings : 2 ways to Remove WordPress Self Pingbacks
  • Load Disqus Comments On Click With AJAX
  • How to Add HTML 5 Support to Thesis Theme
  • Boilerplate CSS Media Queries for Responsive Website
  • JavaScript to Load Disqus on Scroll
  • How to Style External Links With CSS

Bluehost and Siteground Coupons for January 2016.

Best Premium WordPress Themes from TemplateMonster
download wordpress themes from MonsterOne

Categories

  • Blog
  • Blogger
  • Genesis Tutorials
  • Social Media
  • Top Websites
  • Twenty Fifteen WordPress Theme
  • WordPress Plugins
  • WordPress Tutorial