Docs

[mynvbox]

Can you help me modify the following javascript that was working with X menus but does not function now that I changed to uber menu. I have a stacked logo in integrity 1 that I want to move inline when user scrolls down. I am using this on Team Sports Direct. Here is what was previously working:

jQuery(document).ready(function($) {
var $masthead = $(‘.masthead’);
var $logo = $(‘.x-brand’);
var $navbar = $(‘.x-navbar’);
var $navBtn = $(‘.x-btn-navbar’);
var $logoBar = $(‘.x-logobar-inner > .x-container’);

function navStackToInline() {
if ( $navbar.hasClass(‘x-navbar-fixed-top’) ) {
$masthead.removeClass(‘masthead-stacked’);
$masthead.addClass(‘masthead-inline’);
$logo.insertBefore($navBtn);
} else {
$masthead.removeClass(‘masthead-inline’);
$masthead.addClass(‘masthead-stacked’);
$logo.appendTo($logoBar);
}
}

navStackToInline();

$(window).ready(navStackToInline).scroll(function() {
navStackToInline();
});

});

[Rupok]

Hey there,

Thanks for writing in! Regretfully, this particular customization request is outside the scope of our support as this is not related to an issue with the theme and instead has to do with your customization of it. As such, you will need to investigate this particular issue on your own or seek help from a developer should you not feel comfortable making these changes yourself. If you have any further questions about the theme, we are more than happy to provide you with assistance on these inquiries.

Thank you for your understanding.

[mynvbox]

I’ve never seen such a wide spectrum of support. Sometimes it’s great and sometimes it is just a waste of time logging in. I got that code from X Theme Support but thanks anyways. See previous x theme support #: https://community.theme.co/forums/topic/stacked-to-inline-logo-on-scroll/#post-142426

[Rad]

Hi there,

That thread is old, and the code is only applicable for X’s menu. While Ubermenu is a 3rd party plugin with fully functional libraries. Hence, that simple tweak is not applicable.

We can only cover customization if it’s just simple tweaking.

Thanks!

[mynvbox]

Sorry for my tone earlier. I’ve already been messing around with it for too long lol. I’ve still been playing with it and I was able to get it to recognize the logo inline with the Ubermenu however I’m missing something that allows the stacked logo before scroll. If you can’t help it’s no big deal but if you see something obvious with the following code, I’d greatly appreciate your feedback. I think what I’m missing is the correct text to put in to: if ( $navbar.hasClass(‘ubermenu’) ) { It used to show x-navbar-fixed-top instead of where I put ubermenu. If you don’t know I guess I can live without it and just use the stacked logo. Thanks!

jQuery(document).ready(function($) {
var $masthead = $(‘.masthead’);
var $logo = $(‘.x-brand’);
var $navbar = $(‘.ubermenu’);
var $navBtn = $(‘.ubermenu-nav’);
var $logoBar = $(‘.x-logobar-inner > .x-container’);

function navStackToInline() {
if ( $navbar.hasClass(‘ubermenu’) ) {
$masthead.removeClass(‘masthead-stacked’);
$masthead.addClass(‘masthead-inline’);
$logo.insertBefore($navBtn);
} else {
$masthead.removeClass(‘masthead-inline’);
$masthead.addClass(‘masthead-stacked’);
$logo.appendTo($logoBar);
}
}

navStackToInline();

$(window).ready(navStackToInline).scroll(function() {
navStackToInline();
});

});

[mynvbox]

Nevermind, my irritation was justified. I was able to do it myself by changing one line of code and I know nothing about javascript. The only change was .x-btn-navbar to .ubermenu-nav. Works with no issues. For anyone else that wants to use a stacked logo that converts to inline upon scroll, use the following custom javascript:

jQuery(document).ready(function($) {
var $masthead = $(‘.masthead’);
var $logo = $(‘.x-brand’);
var $navbar = $(‘.x-navbar’);
var $navBtn = $(‘.ubermenu-nav’);
var $logoBar = $(‘.x-logobar-inner > .x-container’);

function navStackToInline() {
if ( $navbar.hasClass(‘x-navbar-fixed-top’) ) {
$masthead.removeClass(‘masthead-stacked’);
$masthead.addClass(‘masthead-inline’);
$logo.insertBefore($navBtn);
} else {
$masthead.removeClass(‘masthead-inline’);
$masthead.addClass(‘masthead-stacked’);
$logo.appendTo($logoBar);
}
}

navStackToInline();

$(window).ready(navStackToInline).scroll(function() {
navStackToInline();
});

});

[Paul R]

Thanks for sharing. Have a great day!

[Author]

Posts