Support › Forums › Flex Theme › Little problem with Sticky menu Navigation
Tagged: Sticky menu
- This topic has 2 replies, 2 voices, and was last updated 5 years, 4 months ago by
marcomac.
-
AuthorPosts
-
September 15, 2015 at 12:44 pm #558
marcomac
ParticipantHello,
first of all, Flex Pro Theme is fantastic, the best theme I’ve bought since using Genesis Framework.I have a little problem with sticky menu that I have activated following this article: http://www.simpleprothemes.com/sticky-navigation-menu-flex-pro-theme/
It works, but you see a “snap” very ugly looking. I tried to disable the script smoothscrolling.js, same problem.
This anomaly occurs with all browsers on Mac, especially with Firefox sometimes you see a kind of “flash”.
I made this short video where you see this “snap”: https://youtu.be/wj3D7FDPM2E
Thanks for any help or suggestions.
September 15, 2015 at 1:44 pm #559Chinmoy Paul
ModeratorReplace the old sticky nav javascript with this new one
/* =================================== * Sticky Nav * =================================== */ var $header_bar = $site_header = $wpadminbar = 0; if( $('.site-top').length ) { $header_bar = $('.site-top').innerHeight(); } if( $('.site-header').length ) { $site_header = $('.site-header').innerHeight(); } if( $('#wpadminbar').length ) { $wpadminbar = $('#wpadminbar').innerHeight(); } $(window).scroll(function() { if ( $(window).scrollTop() > ( $site_header + $header_bar + $wpadminbar ) ) { $('body').addClass('sticky-nav'); if( $('#wpadminbar').length ) { $('.site-navigation').css({'margin-top': $wpadminbar + 'px'}); } var nav_h = $('.site-navigation').innerHeight(); if( $('body').hasClass('home') && $('#home-top').length ) { $('#home-top').css({'margin-top': nav_h + 'px'}); } else if( $('body').hasClass('home') && ( ! $('#home-top').length ) && $('#home-middle').length ) { $('#home-middle').css({'margin-top': nav_h + 'px'}); } else { $('.site-inner').css({'margin-top': nav_h + 'px'}); } } else { $('body').removeClass('sticky-nav'); if( $('#wpadminbar').length ) { $('.site-navigation').removeAttr('style'); } if( $('body').hasClass('home') && $('#home-top').length ) { $('#home-top').removeAttr('style'); } else if( $('body').hasClass('home') && ( ! $('#home-top').length ) && $('#home-middle').length ) { $('#home-middle').removeAttr('style'); } else { $('.site-inner').removeAttr('style'); } } });
You would edit the global.js file only
September 15, 2015 at 2:04 pm #560marcomac
ParticipantHi,
great, now it works fine!
Even with Firefox, the “flash” has disappearedMany thanks
-
AuthorPosts
- You must be logged in to reply to this topic.