Hoover scale extension example on youtube not working for me

Hi I’m having problems getting the image hoover & scale example that you posted on youtube here to work.

I renamed the CSS extension “image_hover” as you can see below and then tried to call it from the class property for my image component but when I tried to preview it my welcome icon image didn’t scale when my mouse hovered over it as expected. Thanks for your help!

Hello @William_Lee

Can you provide your app id?

I can guess the problem is the wrong cascade of styles. Is image_hover an image? In this case, he cannot contain tags with classes card-image and card-title.

Regards, Dima

Hi Dima thanks for your help my app id is 721AC780-A565-8D74-FF75-5158A2EB5500

image_hover is not an image… It’s just the name I assigned for the extension class as you can see in the 2nd image above.

image

You assign class image_hover to the image. Your styles we could translate to ‘human language’ as:

Make all tags with class “card-image” what be inside the tag with class “card” bigger on hover event

But your image with image_hover class doesn’t contain card-title or card-image, so it doesn’t work.

Here an example where all works fine(i leave it in your extension commented)

image

Regards, Dima

1 Like

Thanks for the explanation… that worked great!