Af777 swivel attachment near me,Mi777 join panalo.Recharge Every day and Get Bonus up-to 50%!

thumbnail image animation

madebymt — Sun, 14 Jan 2018 23:37:25 +0000

Hi everyone
I try to turn my static page to a wordpress theme, I have one image element come with animation, I try to use couple ways, but my image won’t load on scroll (move up), so I was wondering anyone has any solution? Big thanks!

Here’s my HTML element:


img src="images/pexels-photo-386151.jpeg" data-w-id="f56f7b61-5a1c-8912-469a-280339605312" style="-webkit-transform:translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0);-moz-transform:translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0);-ms-transform:translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0);transform:translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0)"
class="image-3">

I turn them to WordPressworpress using

'image-3',
        'style' => '-webkit-transform: translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0);
        -moz-transform: translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0);
        -ms-transform: translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0);
        transform: translateX(0) translateY(152PX) translateZ(0) scaleX(1) scaleY(1) scaleZ(1) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0)'
      ));?>

I try to just use class ‘image-3’ on my CSS, but the animation still not working.

Thank you guys for the help!

Reply To: thumbnail image animation

Muhammad Javed — Mon, 15 Jan 2018 04:12:32 +0000

Hello,
your wordpress function and its attributes are correct even css also apply correct but the css which you are using for animation that is not correct, make sure its correct then it will work.

Thanks

Reply To: thumbnail image animation

madebymt — Mon, 15 Jan 2018 05:55:19 +0000

Hi @leadsoft
Thank you for your response, it works on my regular index.html page, so I don’t know why it won’t show up, even I tried other css, it won’t have animation.

Like this:

 transform: translate(350px,0);
    -webkit-transform: translate(350px,0); /** Chrome & Safari **/
    -o-transform: translate(350px,0); /** Opera **/
    -moz-transform: translate(350px,0); /** Firefox **/

Thank you.

Reply To: thumbnail image animation

Muhammad Javed — Mon, 15 Jan 2018 06:59:46 +0000

i have checked the css is also working i have create small video which shows css is working.
https://www.screencast.com/t/YycamRY7yxmV

Thanks

Reply To: thumbnail image animation

madebymt — Wed, 17 Jan 2018 04:32:56 +0000

Hi @leadsoft
Thank you for that awesome video, really appreciated that, super helpful!
My transition work, but not working on scroll view with my original setup.

Thank you so much for your help!