2

I am using Sitecore 9.3 SXA, wherefrom main page on button click I am redirecting to the video page where we have SXA Tab component below the video. Upon redirecting, the page is getting scrolled to the bottom where the tab is.

I have debugged the tab js, component-tabs, found that when if condition in the below code is hitting, the page is getting auto scrolled to the component as the tab-heading is having some scroll height and scroll width property. If I try by changing or removing the "tab-scrollable" class in the js, the tabs are not functioning.

api.initInstance = function(component) {
   var $tabModule = component.find(".tabs-inner");
   if (component.hasClass("tabs-scrollable")) {
       tabsScrollable(component);
      } 

Is there any way to restrict the auto-scroll?

Thanks in advance

1

Got the fix for my issue. Basically in original js for tabs line number 247 was causing the auto scroll. So added an unique class ('dummy-focus' here) in the top container of page and added the script

const element = document.getElementsByClassName('dummy-focus')[0];
element.scrollIntoView();

after $tabNav.first("li").focus(); (line 247)

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.