Tagged: fullwidth submenu
-
AuthorPosts
-
February 3, 2016 at 7:07 am #576912
Hello,
Thank you for this amazing template. I have a small issue in the secondary sub menu i want active links (anchors) to highlighted, I found a solution in one of earlier created thread in the forum (link is below), I applied the php code and the css, but the links works in funny way. For example when i click second link and when it is active, instead of second link first link looks active. How I can fix it? Also it doesn’t seem like it applies all the pages.February 3, 2016 at 6:37 pm #577248Hey dilge!
Please follow the steps provided here https://kriesi.at/support/topic/fullwidth-sub-menu-active-color/#post-574124 If you still have any issues please let me know we will help you set this up easily.
Regards,
Vinay- This reply was modified 8 years, 9 months ago by Vinay.
February 3, 2016 at 7:56 pm #577297Hello,
I applied the php and css, but couldn’t find the color section. So it is not working for me :(
I did not see any tag section inside full width sub menu item as well.Thank you in advance for your help
February 3, 2016 at 8:07 pm #577305This way in this link was working exactly the way I want it, only it was skipping the link before not the active link.
February 3, 2016 at 8:26 pm #577326Hey!
We are working on your ticket please wait while we update the result here soon.We have checked the menu and the menus are setup correctly.
A modified js code is added to functions.php
// Highlight one page nav function activateMenuItem(){ ?> <script> jQuery(document).scroll(function() { console.log('one page menu'); var sections = jQuery('.avia-section'), menu = jQuery('.av-submenu-container'), nav_height = menu.outerHeight(); jQuery(window).on('scroll', function() { var cur_pos = jQuery(this).scrollTop(); sections.each(function() { var top = jQuery(this).offset().top - 300, bottom = top + jQuery(this).outerHeight(); if (cur_pos >= top && cur_pos <= bottom) { menu.find('a').removeClass('active-menu-item'); menu.find('a[href="#' + jQuery(this).attr('id') + '"]').addClass('active-menu-item'); } }); }); }); </script> <?php } add_action('wp_head', 'activateMenuItem');
And the below css in quick css
/* Your css styles for active menu item*/
.active-menu-item {background:#dfdfdf!important;
}The problem still exist only on this page mentioned in private because when the #ID was added the # was left out please see screenshot. However we have created a new menu called research in appearance > menu and linked that menu to the page.
The issue seem to be in the page and only with 2 sections “Introduction” & “Features” please re-create check the #ID’s if you still have issue please re-create those sections on a draft page should fix the issue.
Regards,
Vinay- This reply was modified 8 years, 9 months ago by Vinay.
February 4, 2016 at 1:34 am #577447Thank you for your help, I changed the ID’s and recreated section so it is working perfectly, I have just another small issue, instead of background when links are active, I just want to change the font color, seems like another css rule is overwriting and I couldn’t find which one. Do you think you can help?
Thank you in advance
February 4, 2016 at 7:05 pm #577991Hey!
Please try this css to get a underline
.active-menu-item:before { content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: .5em; height: 2px; width: -0; background: red; transition: all 0.3s ease; }
Best regards,
Vinay KashyapFebruary 4, 2016 at 7:54 pm #578020No luck so far, I tried only this and the other css together but can not change the font color when sub nav menu item active.
I am adding the links below.February 5, 2016 at 5:48 am #578259Hey!
Use this to change the color of the active menu item:
#top .av-subnav-menu .active-menu-item a .avia-menu-text { color: red; } #top .av-subnav-menu .active-menu-item a { background: transparent; }
This will change the active menu item background:
#top .av-subnav-menu .active-menu-item { background: #f4f4f4; }
You have to remove this:
.active-menu-item { background: #f4f4f4!important; }
We modified the code in the functions.php file a bit.
Cheers!
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.