Jump to Top / scroll after Scene Transition


#1

Hi Daniel!

Thank you for ur answer! I think i managed it now! One more thing, i thought i am asking it here, instead of opening a new thread:

I am using JS to navigate between the Scenes. It works, the only reason is that the “next” screen is not stops at the top, it scrolls a bit lower.

is there a possible way to handle this?


Understanding responsive fullwidth behaviour
#2

Have You tried using the “scrollTop” property?

https://www.w3schools.com/jsref/prop_element_scrolltop.asp


#4

yes, i am using that as the following:

	jQuery(document).ready(function() {
$(window).bind('mousewheel', function(event) {
if (event.originalEvent.wheelDelta >= 0) {
	var scrolledpx = parseInt($(window).scrollTop());
	if (scrolledpx == 0) { hypeDocument.showPreviousScene(hypeDocument.kSceneTransitionPushTopToBottom, 1.1); }
}
else {
	var scrolledpx = parseInt($(window).scrollTop());
	if (scrolledpx >= 175) { hypeDocument.showNextScene(hypeDocument.kSceneTransitionPushBottomToTop, 1.1); }
}

});
});

when i am scrolling top (to the prev scene) its works like charm. but scrolling to the next screen does not take me to the “beginning” to the next screene, it stops somewhere the middle. why is that happens?

thanks.


#5

I do not know why that result is occurring.
Try adding window.scroll(0,0); (last line below) as a remedial measure.

else {
	var scrolledpx = parseInt($(window).scrollTop());
	if (scrolledpx >= 175) { hypeDocument.showNextScene(hypeDocument.kSceneTransitionPushBottomToTop, 1.1);
	window.scroll(0,0);
	}

#6

Hype retains the state of scroll between scenes as it’s attached to the window (scenes are only elements in the DOM) The way… as you have pointed out is to “reset” the scroll after every scene transition. You could do that in the way you’ve done or also on a scene load basis.