Scroll Down Disappears
Laurent
Hi,
I have a strange behavior on a website. on menu, when I click here for instance https://prnt.sc/PCFZSXkhxLdR the page scrolls correctly, but vertical scroll on web browser (chrome) disappears.
Any idea why?
live url in Hidden Content area
Thanks L.
Rashida Rahman
Accepted AnswerHello There,
I hope you’re doing well. I’m sorry for the experience you’ve had so far.
To look into this issue more closely, could you please share temporary Super Admin access (inside the hidden content box)? I’ll check this and update you as soon as possible.
Please make sure to keep a full site backup before sharing the credentials, just to be safe.
Best regards,
Rashida Rahman
Accepted AnswerHi,
Please take my apology. I'm trying some custom JS code, but facing some difficulty to add them in your system. Please allow me time.
Rashida Rahman
Accepted AnswerHi Laurent,
You are welcome.
Are you using any server side caching, please? I have made some changes, but it is not reflecting. Kindly do let me know.
Thanks!
Rashida Rahman
Accepted AnswerThanks for letting me know about the update. I have created and added some code in the custom.js file inside your template.
Laurent
Accepted Answerok but why this problem occured? everything was fine since few months/years. will you merge this fix with next helix update?
Laurent
Accepted Answerok thanks. about custom.js you have added, this file is loaded automatically by helix or you have added some code somewhere to load it?
Rashida Rahman
Accepted AnswerHi,
You are always welcome:)
By default this file doesn’t exist, I have created the custom.js file inside your template, then put the code. The following documentation may help:
Best regards,
Laurent
Accepted Answerhi,
I have applied the fix you did on my website to another website, but I still have the issue.
I have created this js file /templates/shaper_helixultimate/js/custom.js and inside I have added this code :
jQuery(function($) {
$('.close-offcanvas, .offcanvas-overlay, .offcanvas-inner ul > li:not(.no-scroll) > a')
.on('click', function() {
$('body').removeClass('offcanvas-active');
});
$(document).on('click', '.offcanvas-menu a', function (event) {
var href = $(this).attr('href');
if ($(this).hasClass('close-offcanvas') || $(this).hasClass('no-close-offcanvas')) {
return;
}
if (href && href.indexOf('#') === 0 && href.length > 1) {
setTimeout(function() {
closeOffcanvas();
}, 150);
}
else if (href && href.indexOf('#') > -1 && !href.match(/^https?:\/\//)) {
var hashIndex = href.indexOf('#');
var currentPath = window.location.pathname;
var linkPath = href.substring(0, hashIndex) || currentPath;
if (linkPath === currentPath || linkPath === '' || linkPath === '/') {
setTimeout(function() {
closeOffcanvas();
}, 150);
}
}
});
$(window).on('hashchange', function() {
if ($('.offcanvas-init').hasClass('offcanvas-active')) {
closeOffcanvas();
}
});
});but same problem : vertical scroll on web browser (chrome) disappears when an item menu is clicked. see Hidden Content area for website link.
any idea why?
Thanks L
Laurent
Accepted Answerproblem solved. corrected code below
jQuery(function($) {
function forceCloseOffcanvas() {
$('.offcanvas-init').removeClass('offcanvas-active full-offcanvas');
$('body').css('overflow', '');
$('.offcanvas-menu')
.attr('inert', '')
.attr('tabindex', '-1');
$(document).off('keydown.offcanvas');
}
$('.close-offcanvas, .offcanvas-overlay, .offcanvas-inner ul > li:not(.no-scroll) > a')
.on('click', function() {
forceCloseOffcanvas();
});
$(document).on('click', '.offcanvas-menu a', function () {
var href = $(this).attr('href');
if ($(this).hasClass('close-offcanvas') || $(this).hasClass('no-close-offcanvas')) {
return;
}
if (href && href.indexOf('#') === 0 && href.length > 1) {
setTimeout(forceCloseOffcanvas, 150);
}
else if (href && href.indexOf('#') > -1 && !href.match(/^https?:\/\//)) {
var hashIndex = href.indexOf('#');
var currentPath = window.location.pathname;
var linkPath = href.substring(0, hashIndex) || currentPath;
if (linkPath === currentPath || linkPath === '' || linkPath === '/') {
setTimeout(forceCloseOffcanvas, 150);
}
}
});
$(window).on('hashchange', function() {
if ($('.offcanvas-init').hasClass('offcanvas-active')) {
forceCloseOffcanvas();
}
});
});Rashida Rahman
Accepted AnswerHi,
Are you facing this issue on mobile devices with offcanvas menu?
Kindly share your admin access to check.
Rashida Rahman
Accepted AnswerHi,
Thanks for the credentials.
On desktop/laptop, it looks fine on my end. Please make sure all caches are cleared, including both Joomla and any server-side caching, if you are using them.
Laurent
Accepted AnswerAlready done, same problem. I'm sorry but does not work. Do this
- go on private navigation mode on your browser
- then go on live url (see Hidden Content area)
- then reduce your windows
- at this stage, vertical scroll bar is displayed => https://prnt.sc/Qdi02A4f6wtU
- then open mobile menu and click on any item => https://prnt.sc/WSaVJNpRl0Ib
- then mobile menu close automatically and vertical scroll bar is not displayed anymore => https://prnt.sc/G90KNEmJ0Fxr