Forum Replies Created
-
AuthorPosts
-
Hiya. I’ve been adjusting code so it may look different now. The space is 40px. I found a CSS hack by adding
margin-bottom:-40px
to the div above the submenu and then addingmargin-top:40px
to the submenu. However as the element above is not fixed across the site it’s hard to replicate dynamically.Richard
Hi Mike
No that part is working OK, it’s the white space above the grey box that only appears after the initial scroll that’s annoying me.
Richard
Hi Mike
The initial appearance on scroll sticks to the top in the right place, but when you scroll back down you’ll see the white space appear. I’ve reverted to the code from earlier and added you changes.
Richard
Hi Mike
Thanks for looking again and yes I’ve been messing with some custom JS to control the start point. Currently seeing if this will work
add_action( 'wp_footer', 'enfold_customization_custom_scripts' ); function enfold_customization_custom_scripts() { ?> <script type = "text/javascript"> jQuery(document).ready(function(){ // var menu = document.querySelector('#sub_menu1') var menuPosition = menu.getBoundingClientRect().top; window.addEventListener('scroll', function() { if (window.pageYOffset >= menuPosition) { menu.style.position = 'fixed'; menu.style.top = '40px'; } else { menu.style.position = 'static'; menu.style.top = ''; } }); // </script> <?php }
Unfortunately the CSS adjustments you suggested don’t work. Will keep trying.
Richard
Hi Mike
The grey navigation is not supposed to have the padding above it. The menu items should be sitting central in a box only 30px deep.
Richard
Thanks Mike
I’ve had a look and it’s partially solved the problem with this adjustment
// custom script function add_custom_script(){ ?> <script> (function($){ function g() { var scrolled = $('.header-scrolled').length; if( scrolled == 1 ) { $('#sub_menu1').css('margin-top', '0px'); } else { $('#sub_menu1').css('margin-top', '30px'); } } $(window).scroll(function() { g(); }); })(jQuery); </script> <?php } add_action('wp_footer', 'add_custom_script');
However the pixels added to the margin remain even when the user scrolls back the other way.
Ideally I need to change the start position of the sticky when it hits the top of the browser.
Richard
Half way there with
#header_main { height: 100px !important; top: 30px; } #header_meta { position: fixed; width: 100%; top: 30px; }
But still need some help changing the sticky position of the submenu.
Thanks
Thanks Victoria, will do.
Hi Ismael
Perfect thank you very much for the extra code. Works like a dream.
Richard
Ismael
I’ve added the following to functions:
add_action('ava_after_main_title', 'ava_after_main_title_mod'); function ava_after_main_title_mod() { if( is_singular('post') ) { echo do_shortcode("[av_submenu which_menu='' menu='4' position='center' color='main_color' sticky='aviaTBsticky' mobile='disabled'] [av_submenu_item title='Treatments' link='manually,http://' linktarget='' button_style=''] [av_submenu_item title='Spa Days' link='manually,http://' linktarget='' button_style=''] [av_submenu_item title='Fitness' link='manually,http://' linktarget='' button_style=''] [av_submenu_item title='Fashion' link='manually,http://' linktarget='' button_style=''] [av_submenu_item title='Health' link='manually,http://' linktarget='' button_style=''] [av_submenu_item title='Special offers' link='manually,http://' linktarget='' button_style=''] [/av_submenu]"); } }
Which has worked for posts only. However it’s pushing the widget column down the page. See link.
Any idea how to fix?
Thanks
RichardHi Ismael
Thanks for this but do you mean add this example to the single.php file or in to the functions file?Richard
This reply has been marked as private.Hi Ismael
In the end I’ve styled each sub-nav using it’s unique id. It’s not the prettiest solution but it works.
Thanks
RichardThanks Basilis but i’m afraid that did not fix the problem.
Richard
Hi John
Thanks for the solution, alas it did not work though – the last menu item was just stacked under the rest.
RichardHi Yigit
That’s awesome – works like a charm. Thanks again for your help.
RichardHi Yigit
That was super fast thank you. That works perfectly – one last thing. Is there a way to make the submenu the same width as the menu without having to include more menu items?
Thanks
RichardNope please close Sarah, thanks.
Hi Rikard
That’s what I suspected, thanks for confirming.
RichardI’ve got a plugin installed to mask the site but this link should work.
Richard
Hi Victoria
OK thanks – do you know which selector it would be. I've tried #top #menu-item-search:hover>a { content: "/ue813"; }
Richard
Thanks Jordan
How do you replace a specific icon for this specific state though on the search menu item?
RichardHi Nikko
That’s fantastic thank you and works fine.
Thanks for your help
RichardHi Basilis
Thanks for looking, yes just fixed it by changing the id to .blog.
Richard
Sorted with”
.blog .blog-categories.minor-meta { display: none!important; }
Thanks
RichardHi Yigit
Thank you very much for the solution for that. Worked fine.
Richard
Hi Andy, yes of course.
I’ve applied
display: inline;
to the post heading so not sure how that will affect the reordering?Thanks
RichardSorry guys, hadn’t realised my support had expired. I’ve purchased additional support now.
Hi Yigit
Spot on thank you. Made a slight tweak to the indent but working like a treat now.
Thanks
RichardHi Yigit
Sorry for the delay. The site is in development so still a few holes, see link below. The section needing em dashes is the three columns under services.
Thanks
Richard -
AuthorPosts