Return to previous page

Current Menu Item not working in Royal v1.3

This topic has 10 replies, 3 voices, and was last updated 10 years, 1 months ago ago by Eva Kemp

ckitso

Participant

October 7, 2014 at 15:25

Hi I recently updated a development site to Royal v1.3 but since doing so the current menu item highlighting isn’t working correctly and there is a bug when the fix nav bar appears.

If I go to a page like about us, the menu item “about us” is highlighted as per normal using css current menu. However if i scroll down the page and the fixed nav menu appears it no longer highlights the correct menu item, instead it highlights the first menu item. It appears as though it is attaching the current-menu class to the wrong menu item on activation of the fixed menu.

Is this a known issue? Is there a work around ?

#18656 Copied

9 Answers

ckitso

Participant

October 7, 2014 at 17:08

It appears as though the problem exists even without the use of the fixed header.
As soon as i scroll down the page the current menu highlight moves to the first item in the menu. It seems as though scrolling down the page which hides the menu, somehow triggers an event to attach a current-class to the first menu item.

For the life of me I can’t figure out why it would do that ? I can’t find any script to trigger this action.

When I revert to version 1.2 everything works perfectly. Any assistance would be greatly appreciated.

Thanks

#18681 Copied
ckitso

Participant

October 7, 2014 at 17:30
Ok it seems I have found the problem.

It seems the following code in the etheme.js is causing the change in current-item-class.
I simply removed it and everything works, obviously not the best idea to change core files so if there is another work around please let me know.
```
// **********************************************************************// 
    // ! One page hash navigation
    // **********************************************************************//
    
    $(function() {
    
    	// Click on menu item with hash
	    var menu = $('.menu');
	    menu.each(function() {
	    	var that = $(this);
		    var links = $(this).find('a');
		    links.click(function(e){
		    	if($(this).attr('href').split('#')[0] == window.location.href.split('#')[0]) {
		    		e.preventDefault();
			    	var hash = $(this).attr('href').split('#')[1];
			    	
			    	//et_change_active_item(hash);
			    	et_scroll_to_id(hash);
		    	}
		    });
	    });
	    
	    // if loaded page with hash
	    var windowHash = window.location.hash.split('#')[1];
	    
	    if(window.location.hash.length > 1) {
	    	setTimeout(function(){
	    		et_scroll_to_id(windowHash);
	    	}, 600);
	    }
	    
	    function et_scroll_to_id(id){
		    var offset = 150;
	    	var position = 0;
	    	
	    	if(id != 'top'){
		    	if($('[data-anchor="'+id+'"]').length < 1) {
			    	return;
		    	}
		    	position = $('[data-anchor="'+id+'"]').offset().top - offset;
	    	}
		    
	    	
	    	$('html, body').stop().animate({
		    	scrollTop: position
	    	}, 1000, 'easeOutCubic', function() {
		    	et_change_active_item(id);
	    	});
	    }
	    
	    function et_change_active_item(hash) {
	    	var itemId;
	    	var menu = $('.menu');
	    	
	    	menu.find('.current-menu-item').removeClass('current-menu-item');
	    	
	    	if(hash == 'top') {
	    		menu.each(function() {
		    		$(this).find('li').first().addClass('current-menu-item');
	    		});
	    		return;
	    	}
	    	
	    	menu.find('li').each(function() {
		    	var thisHash = $(this).find('>a').attr('href').split('#')[1];
		    	if(thisHash == hash) {
			    	itemId = $(this).attr('id');
		    	}
	    	});
	    	
	    	$('.'+itemId).addClass('current-menu-item');
	    }
	    
	    
	    $(window).scroll(function() {
	    	if($(window).scrollTop() < 200) {
		    	et_change_active_item('top');
	    	}
	    });
	    
	    // change active link on scroll
	    $('[data-anchor]').waypoint(function() {
		    var id = $(this).attr('data-anchor');
	    	et_change_active_item(id);
	    }, { offset: 150 });

    });
	
```
#18684 Copied
Eva Kemp

Support staff

October 8, 2014 at 08:34

Hello,

Thank you for notification.
We’ll take this issue into our account for further investigation.

Regards,
Eva Kemp.

#18790 Copied

ckitso

Participant

October 8, 2014 at 09:57

Thanks Eva.

#18807 Copied

Eva Kemp

Support staff

October 8, 2014 at 11:30

Hello,

You’re welcome.

Regards,
Eva Kemp.

#18825 Copied

Royalty

Participant

October 10, 2014 at 13:25

Same problem here. Your solution worked for me (thanks for sharing it!) but a real bugfix would be really appreciated because this bug also exists in your demo: https://www.8theme.com/demo/royal

#19173 Copied

Eva Kemp

Support staff

October 10, 2014 at 15:56

Hello @Royal Fan,

We’ve taken this issue into our account and it should be fixed in future update.
Sorry for inconveniences.

Regards,
Eva Kemp.

#19199 Copied

Royalty

Participant

October 29, 2014 at 19:45

This bug isnt fixed in the just released version 1.4. When will you fix it?
Thank you in advance.

#22349 Copied

Eva Kemp

Support staff

November 3, 2014 at 13:04

Hello @Royal Fan,

Please take our apologies for the troubles, but our developers are working on this bug and it will be fixed in the next update. If they found the solution much more earlier we’ll notify you.

Thank you for your understanding and patience.

Regards,
Eva Kemp.

#22926 Copied
Tagged: current, item, menu, royal, templates, v1.3, woocommerce, wordpress
Viewing 10 results - 1 through 10 (of 10 total)

The issue related to '‘Current Menu Item not working in Royal v1.3’' has been successfully resolved, and the topic is now closed for further responses

Current Menu Item not working in Royal v1.3

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection