Is there a way to increase/decrease the height of an element by 1px (or any value) when you click on a button?

Nicolas T shared this question 4 years ago

I have two buttons (plus - minus) that I want to increase/decrease the height value of a container by 1px.

I just want to see if it's possible with JustInMind to update values (not just text values) and be able to demonstrate simple prototypes with basic graphs.

Another option would be to move this container up/down which would create a similar effect.


Comments (1)


Hi Nicolas,

You can do so by creating a variable with the default size being the height of the element you want to resize.

Then on the + button you have to add an event: Set Value on "your height variable" and choose calculated. And in the expresion builder drag the variable, the + function and write 1.

Then click on OK twice.

Now click on the gear button next to the word Do in the event you just created and click on add action.

This time select the Resize action and in Height choose calculated. Now in the expression builder drag the variable.

Click on OK twice and you are done.

This event will make the element resize downwards.

If you want it to grow upwards click again on the gear icon next to the word do and this time selec a Resize action. Select "By offset" and write -1 in the Top input. Click twice on OK and that will be it.

Make sure that in the Set Vaule action the target is the variable and that in the Resize and move the target is the element you want to resize and move.

To do the size decrease do the same but add a condition to the event being that if the variable is larger than zero.

If anything is unclear please let me know and I will try to explain in other words.