I'd like for the mini menu to be triggered after a short scroll distance. Becasue I have a large logo, the page contents end up underneath the full menu for some distance until the mini menu is triggered, which is problematic. How can I accomplish this?
Sorry Erik, You have to modify the theme core. I dont see a easy way to do this. You have to modify the file classic-menu/js/classic-menu.js Your request is beyond the scope of our support. Sorry.
Found the code (below), however changing the 150 values in the conditional statements doesn't affect behavior on the page. Are those indeed the right values to tweak, or does there need new code to be added/modified?
// Activate Mini menu. var lastScrollTop = 0
$(document).on('scroll touchmove', function (e) { var offset = $(this).scrollTop() var st = $(this).scrollTop()
Figured it out. Those were indeed the values to tweak, however I needed to modify the minified javascript file which was in the same folder (classic.min.js)
I'd like for the mini menu to be triggered after a short scroll distance. Becasue I have a large logo, the page contents end up underneath the full menu for some distance until the mini menu is triggered, which is problematic. How can I accomplish this?
Thanks,
Erik
Sorry Erik,
You have to modify the theme core. I dont see a easy way to do this.
You have to modify the file classic-menu/js/classic-menu.js
Your request is beyond the scope of our support. Sorry.
Thanks,
Alexandre from the Sonaar.io Crew
Hi Alexandre,
Found the code (below), however changing the 150 values in the conditional statements doesn't affect behavior on the page. Are those indeed the right values to tweak, or does there need new code to be added/modified?
// Activate Mini menu.
var lastScrollTop = 0
$(document).on('scroll touchmove', function (e) {
var offset = $(this).scrollTop()
var st = $(this).scrollTop()
if (($('.classic-menu').hasClass('mini-active') || $('.classic-menu').hasClass('mini-fullwidth-active')) && !$('.classic-menu').hasClass('responsive')) {
if (offset > 150) {
if (!$('.classic-menu').hasClass('mini')) {
$('.classic-menu').addClass('mini');
}
if (logo_url !== logo_scroll_url) {
$('.classic-menu').find('.classic-menu-logo').attr('src', logo_scroll_url)
$('.classic-menu').find('.classic-menu-logo').attr('srcset', logo_scroll_url + ' 1x, ' + logo_mini_url + ' 2x')
}
if (logo_mini_url != '') {
$('.classic-menu').find('.classic-menu-logo').attr('src', logo_mini_url)
$('.classic-menu').find('.classic-menu-logo').attr('srcset', logo_mini_url + ' 1x, ' + logo_mini_url + ' 2x')
}
}
if (offset <= 150) {
if ($('.classic-menu').hasClass('mini')) {
$('.classic-menu').removeClass('mini')
}
$('.classic-menu').find('.classic-menu-logo').attr('src', logo_url)
$('.classic-menu').find('.classic-menu-logo').attr('srcset', logo_url + ' 1x, ' + retina_logo_url + ' 2x')
$('.classic-menu').css('height', '')
}
}
lastScrollTop = st
//
Figured it out. Those were indeed the values to tweak, however I needed to modify the minified javascript file which was in the same folder (classic.min.js)