thanks for that fine piece of software which i am starting to love.
I am working on a dummy for a project and for learning purposes i am trying to mix and put in everything i can imagine.
What i have done so far:
CSS is working -> the gradient animation in background
Sliders that output values (thanks to this forum i got a very good tutorial)-> Here is my first problem. Every slider has its own Timeline with 100 frames for 100 counts of the variable in the javascript (amounts()). Why is it counting only till the value 3?
next thing is:
How do i pass the slidervalue to the other javascript (mychart()) that feeds the chartjs library which for testing is set to 33 for every segment?
Is there anything else i should or could do different or better? learn_dummy.hype.zip (294.3 KB)
Would you mind providing a bit more detail with specific steps to reproduce the problem and how you see the issue? I'm not sure I follow what actions in the document that need to be done or how to see the problems you hit. It'd be good to call out what elements to interact with/look for. Thanks!
returns the time in seconds and not frames. so if you'd like to get a percentage one possibility is to compare it to the duration of the timeline.
///////////////
having two separate hypefunctions exchanging arguments can be done by setting the vars in an environment that both can reach (like window or hypeDocument.customData) or passing args directly in a functioncall
i tried your suggestion but now the counter jumps from lowest position of the slider 0 to 1 at the highest position of the counter.
This is how i used your snippet:
// gather amounts
hypeDocument.customData.left_Percent = Math.round(hypeDocument.currentTimeInTimelineNamed('left_slider')/hypeDocument.durationForTimelineNamed('left_slider'))*100;
var amount1 = hypeDocument.customData.left_Percent;
//var amount1 = hypeDocument.currentTimeInTimelineNamed('left_slider');
var amount2 = hypeDocument.currentTimeInTimelineNamed('middle_slider');
var amount3 = hypeDocument.currentTimeInTimelineNamed('right_slider');
// calculate sum
var sum = (amount1 + amount2 + amount3);
// get elements
var amount1Element = hypeDocument.getElementById('amount1');
var amount2Element = hypeDocument.getElementById('amount2');
var amount3Element = hypeDocument.getElementById('amount3');
var sumElement = hypeDocument.getElementById('sum');
// set elements to new values
amount1Element.innerHTML = amount1.toFixed(0);
amount2Element.innerHTML = amount2.toFixed(0);
amount3Element.innerHTML = amount3.toFixed(0);
sumElement.innerHTML = sum.toFixed(0);