Animate an HTML attribute

[DavidP95]

Hi community,

 

is it possible to animate an attribute of an HTML element, for this instance, a value attribute of input number type, as in the screenshot? It represents number 25 in the second screenshot, which I would like to animate without touching the entire input.

 

Thanks in advance.

[mvaneijgen]

Hi @DavidP95 welcome to the forum!

 

 

We usually ask people to provide a minimal demo with their question so that we don't have to spend time creating demos and can focus on answering questions, but also to show what you've already tried. Most people solve their own problems by opening up a CodePen and just trying a few things to see what sticks.

 

Since you're new here and I had some time to spare, I've created a demo for you, but be sure to include one next time you ask a question!

 

You can indeed tween the number in an input field, but there isn't much to animate. You don't have direct access to the separate elements inside the input element. If you want more control, you can always copy the input element and create your own, to which you do have full control.

 

 

Hope it helps and happy tweening! 

 

See the Pen MYaamBX by mvaneijgen (@mvaneijgen) on CodePen.

[DavidP95]

Hi, thanks for your reply. I will make sure to include a demo for the next time. Thanks once again.