Hi Wix. Your scrollTo() doesn't work

Ask the community
,
1

THE PROBLEM

As reported by others, scrollTo() works perfectly in preview but not on the live site. I’ve tried putting the code in the viewportEnter event of the first strip on the page, as others have done, but it still doesn’t work on the live site.

SCENARIO

On the home page, I have a listing of course categories. Under each category there are links to the several courses that belong to that category. When the user clicks on a course, they are taken to a page that displays the details of that course along with a button offering them a return back to where they had been on the home page.

IMPLEMENTATION

On the home page, each category and its courses are in a strip. When the user clicks on a course, a page called coursebrowser is loaded showing the course details. But first, a session variable is loaded that identifies the category so that we can return to this strip later.

The course browser page has a button to allow the user to return to the category they had been viewing on the home page. When that button is clicked, it updates the RequestingPage session variable to “COURSEBROWSER”, then simply loads the home page.

In the onReady() function of the home page, I check to see if we are returning from the course browser and, if so, the CategoryID session variable is checked to determine the category and then the category’s strip’s (or anchor’s) scrollTo() is called.

THE CODE

Here’s the click event function of one of the courses on the home page. The CategoryID is the session variable that identifies the category (and, by association, the strip on the home page to which the user may want to return). In this case, the category id is “500”. (RequestingPage and itemNo just allow the coursebrowser know how to set things up to display the requested course.)

export function txtTitleUWNat_click(event) {
  session.setItem('RequestingPage', 'HOME');
  session.setItem("CategoryID", "500");
  session.setItem("ItemNo", "2");
  wixLocation.to("/coursebrowser");
}

Here’s the code–originally in the onReady() function of the home page then moved to the viewportEnter() of the first strip–that scrolls to the appropriate strip. The code checks if we’re coming from the coursebrowser. If we are, it scrolls to the desired strip (the toggleFold() function is called to collapse all strips except for the one we want which it expands).

I’ve tried stripName.scrollTo() as well as the anchors shown.

export function strip1_viewportEnter(event) {
 // let's find out if we're supposed to be showing a particular category

 let categoryID = session.getItem('CategoryID'); // the current category to display
 let ReqPg = session.getItem('RequestingPage');

 if (ReqPg === 'COURSEBROWSER') {
 if (categoryID === '100') {
        toggleFold(1, 1);
        $w('#ancLearnToDive').scrollTo();
      }
 else if (categoryID === '200') {
        toggleFold(2, 1);
        $w('#ancAdvancedCertifications').scrollTo();
      }
 else if (categoryID === '300') {
        toggleFold(3, 1);
        $w('#ancModeSpecialties').scrollTo();
      }
 else if (categoryID === '400') {
        toggleFold(4, 1);
        $w('#ancPowerSpecialties').scrollTo();
      }
 else if (categoryID === '500') {
        toggleFold(5, 1);
        $w('#ancMarineBiologySpecialties').scrollTo();
      }
 else if (categoryID === '600') {
        toggleFold(6, 1);
        $w('#ancAdaptiveDivig').scrollTo();
      }
    }

}

Thanks for your help!