I have a page which has content wrapped within a scrollable DIV element (using CSS overflow: auto;
). When I integrate Joyride plugin to tour the elements within the DIV it does not correctly scroll to the respective position in the DIV. Instead it scrolls the entire page.
Please refer: https://jsfiddle.net/dkz33k3j/
Is there anything I have missed or any workaround to solve this issue?
I tried the same with EnjoyHint library as well, but couldn't find out a proper solution. Instead as a workaround I have added bookmarks within the page and then manually scroll to the bookmark before executing the step.
$(document).ready(function() {
$('#joyRideTipContent').joyride({
autoStart: true,
modal: true,
expose: true,
preStepCallback: function(index, tip) {
if (index === 4) {
location.hash = 'anchor-name';
}
}
postStepCallback: function(index, tip) {},
});
});
<a name="anchor-name"></a>