Sliders widget in a symbol strategy?

Hey gang-

I am creating a widget with multiple sliders, and obviously don’t want to have to create 1 animation set for each slider. Thank you Symbols! I have also used js to spit out the value of the slider (based on width) to update the value of the slider:

snapshot

As the javascript depends on a Unique ID, both sliders adjust the second text box, which is Not So Super.

Does anybody have advice on how to make multiple sliders without creating 1 animation set + Unique ID element for each widget?

sliders.hype.zip (19.4 KB)

Super extra credit: being able to enter text into the text box and have the slider adjust to that. I haven’t even begun to contemplate how that is done…

slidersxyz.hype.zip (13.9 KB)

an id has to be unique. if you use a class instead …

4 Likes

Sweeeeeet. Thank you Hans-Gerd! I didn’t know about that technique. The text entry part = Swoon :wink:

@jonathan

you may mention in the documentation that behaviours on elements within a symbol will only affect this current instance of the symbol. so for example a mouseover with behaviour to execute a timeline will only run the timeline of this symbolinstance. all other symbolinstances will not be affected. this happens in opposite to this general statement:

Because editing one instance of a symbol changes all instances, symbols are also useful for sharing identical elements across multiple scenes or at different positions in the same scene.

The description of API regarding symbols – however – clearly points out that symbolinstances can be animated separately :slight_smile:

If i missed something -> please kick me out :wink:

I think the key word there is editing as apposed to running the animation in an instance.
When you change/edit a behaviour or element

This applies

Because editing one instance of a symbol changes all instances, symbols are also useful for sharing identical elements across multiple scenes or at different positions in the same scene.

When you run the animation, this applies

1 Like

i would call it a feature, but it’s not clearly stated out in the documentation … at least i could not find it :slight_smile:

You actually read ALL the documentation ?.. :stuck_out_tongue_winking_eye: :grin:

I probably should read it fully at some point… but I agree it could be made more clear, maybe in one of the blue notes.

1 Like

I’ve adapted Hans-Gerd’s so that you’re not limited to a very small slider to grab when you begin by applying the drag to a parenting group and reading the width of a child element:

slidersxyz_v2.hype.zip (17.3 KB)