Streaming live at 10am (PST)

Change padding on hover interactions is it posible for another element, not for hovered?


#1

hi, is it possible without show/hidding the objects?

Thanks!


Here is my public share link: LINK
(how to access public share link)


#2

It is possible, yes.


#3

Aaron beat me to it :slightly_smiling_face:

Just give the element a class, then select the ‘States’ - choose hover - change padding.

Switch back to normal state and test it out!

No need to go into the actual ‘Interactions’ panel unless you need to get really detailed.


#4

ok, sorry, is it possible to do for another element? not fo hovering elements.


#5

Do you mean hover on one element, and it affects a different one?


#6

Yes, i have a text element and some child text in it. And a want to change padding on child text element, when i hover mouse on the parent text element.


#7

Hi @jmilo

I’m pretty sure it’s not possible from the list of native options, so you may need to look at a workaround with scaling and movement of the child element…when you hover the parent.

Anything spring to mind @vincent @nita ?


#8

You can’t, per se, affect the padding of another element. But you can affect its size. So if you have 2 nested divs of the same size, changing the dimensions of the one inside the other is like changing the padding of the outer one.


#9

ok, thanks. Is it posible to change status (like hofer, focus etc…) more smoothly without interactions? Use transitions or some one else?

Thanks for helping


#10

Yep, you can use transitions for the ‘states’ in the styles panel. Add a transform, and then decide the transition to apply.

That is only for the actual element though, so you need to delve into interactions if you want to affect another element. :slightly_smiling_face:


#11

it is work, thanks!11