Forums

Rocking picture effect not working in IE

Permalink
Hi, Could someone help me with this. In the "Child's Play theme
the rocking picture effect doesn't work when I use IE9 or 8. Steve has not come up with an answer so I thought the Concrete "brain trust" could have a solution.
First of all if you have IE test at:http://childsplay.c5themepark.com/...
I'm hoping there is a work around since my client loves the effect.
The css rule is:
.r {
-o-transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
-o-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

.r:hover {
-o-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}

Any help would be greatly appreciated.
nickntime
 
boomgraphics replied on at Permalink Reply
boomgraphics
You would have to add some javascript. It should be pretty simple, if you know how to implement a jQuery plugin. Go here for a cross browser rotate plugin: http://code.google.com/p/jqueryrotate/...

Include it in your header, and make the init that targets all the images. There should be some good documentation at the plugin site. Good luck!
nickntime replied on at Permalink Reply
nickntime
I have used jQuery before using Dynamic Drive script on html sites. I was hoping to still use the CSS rule since not only images but tables can be assigned a class.
Just to clarify since I'm new to C5, if I were to use jQuery I would put the script in the header.php the js file would go into the root directory?? And (sorry) the script to trigger the event wasn't clear to me on the site you recommended.
It's too bad that IE cant handle what all other browsers seem to do easily.