Making both the start frame AND the end frame relative?

Animation
4

In case anyone is interested the relevant JS code is …

var topOfElement = hypeDocument.getElementProperty(element, 'top');
	
	hypeDocument.setElementProperty(element, 'top', topOfElement - 50, 0.5, 'easeout'); // rise by 50 px
	setTimeout(restoreTop,500);  // 500 mS for element to rise by 50 px
	
	function restoreTop() {
		hypeDocument.setElementProperty(element, 'top', topOfElement, 0.5, 'easein');
		}

You can’t just run two setElementProperty calls in succession (one with -50 pixels and the other +50 pixels) as the second one will be executed before the first has really got going and the element will just drop 50 pixels. Hence the need for the setTimeout() with a delay equal to the time spent easing the element upwards. The second (time-delayed) call of setElementProperty just uses the original top value as this parameter is loaded immediately after the first call (ie the value of ‘top’ is the original value).

This all works fine: the element jumps up 50 px and then drops down again.

1 Like