fix: Autoscroll on page when using jump_to_id (#27952)

This PR changes the default function of HTML anchor tags that focus on
another element on a different page in the course. Previously the anchor
tags that were set to scroll on a different page would open up the page
but remain at the top of the page. As a result, users would have to
manually scroll to the correct part of the page if that information is
known or they will read the entire page. Now when the anchor tag is used
to focus on a different page, the link of the new page is checked for a
hash and sends the location of the hash to the parent page to scroll to
the correct location. This change will impact the Learner in the New
Experience view.
This commit is contained in:
Kristin Aoki
2021-06-16 12:43:56 -05:00
committed by GitHub
parent 1d4bb15aa5
commit 3cf541cc76

View File

@@ -153,7 +153,21 @@ ${HTML(fragment.foot_html())}
})
return;
}
// Monitor for messages and checks if the message contains an id. If
// there is an id, then the location of the selected focus element
// is sent through its offset attribute. The offset will allow the
// page to scroll to the location of the focus element so that it is
// at the top of the page. Unique ids and names are required for
// proper scrolling.
window.addEventListener('message', function (event) {
if (event.data.hashName) {
var targetId = event.data.hashName;
var targetName = event.data.hashName.slice(1);
// Checks if the target uses an id or name to focus and gets offset.
var targetOffset = $(targetId).offset() || $(document.getElementsByName(targetName)[0]).offset();
window.parent.postMessage({ 'offset': targetOffset.top }, document.referrer);
}
})
window.parent.postMessage({
type: 'plugin.resize',