Css transitions

[Jennine]

Hello,
I am trying to apply some custom css transitions to the theme but they are not working. Is there something specific in this theme that is causing the issue? I have attached a screen shot of my code. Please advise. Thank you

[basanta]

Hi There,

Thanks for writing in!

Actually the screenshot is not visible clearly!
Can you please clarify what exactly you are trying to do with the CSS transition. Also you post the CSS here to check the code in our setup.
There is no such issue with the them for custom CSS, it should work.

Please give us the details so that we can check and give you suggestion. Also this is something related to a custom code we can only point to to right direction.

Thanks

[Jennine]

thanks for your response. Here is the code and a link to what I am trying to achieve. https://vimeo.com/282368151

.screen{
width: 95%;
height: 375px;
position: relative;
overflow: hidden;
background: #fff;
cursor: pointer;
margin: auto;
margin-bottom: 20px;
transition: transform .5s ease-in-out 0.05s;
-webkit-box-shadow: 0 3px 15px 0 rgba(0,0,0,.1);
box-shadow: 0 3px 15px 0 rgba(0,0,0,.1);
border-radius: 5px;
}
.screen img{
position: absolute;
left: 0;
top: 0;
transition: transform 3.25s ease-in-out 0.8s;
}
Thank you

[nabeel]

Hey there,

Thanks for the example video, I believe you’re looking for hover scale transition effect, please follow https://codepen.io/wifeo/pen/qzwkb or this simple example https://css-tricks.com/snippets/css/scale-on-hover-with-webkit-transition/

Hope this helps!

[Jennine]

thank you. that helped : )

[Prasant]

You are most welcome.