How to rotate an image?

Question

I want to know how to rotate an image arround its center.

I want when i click on the image,the picture will start rotating as long as an ajax call not successful.

Please help me to find out.

Mount your screen on a small electric motor and have it rotate ? — adeneo, Dec 27 '13 at 10:36
please refer to [http://stackoverflow.com/questions/750358/with-jquery-how-can-i-implement-a-page-loading-animation] — Jeevaka Nuwan Fernando, Dec 27 '13 at 10:37
https://www.google.com/search?q=rotate+image+css&rlz=1C1CHFX_frFR561FR561&oq=rotate+image+css&aqs=chrome..69i57j0l5.2290j0j7&sourceid=chrome&espv=210&es_sm=122&ie=UTF-8 — Yabada, Dec 27 '13 at 10:38
http://loadergenerator.com/ OR http://preloaders.net/en/search/ajax+loader — Anup, Dec 27 '13 at 10:42
Well he wants to switch a rotating image to a non-rotating image when an ajax call is successful. — enguerranws, Dec 27 '13 at 10:44
possible duplicate of [jQuery image rotate to replicate an animated gif](http://stackoverflow.com/questions/6016032/jquery-image-rotate-to-replicate-an-animated-gif) — Liam, Dec 27 '13 at 11:04

Kiran RS · Answer 1 · 2013-12-27T10:50:08.123

Try any of this code on your css,(this will work only on mouse hover.)

 -webkit-transform: scale(1.1) rotate(5deg*);
  -moz-transform: scale(1.1) rotate(5deg);
  transform: scale(1.1) rotate(5deg);

Example, CSS

.alt-col:hover {
  -webkit-transform: scale(1.1) rotate(5deg);
  -moz-transform: scale(1.1) rotate(5deg);
  transform: scale(1.1) rotate(5deg);
}

HTML

 <img src="" alt="" class="alt-col">

score -1 · Answer 2 · answered Dec 27 '13 at 10:48

-1

You can switch images with css classes corresponding to the success of the ajax request :

when the ajax request isn't over / fail -> use a gif or a CSS animation to rotate it
when the request is complete, add a class "success" on your element to stop the animation, or change the image.

answered Dec 27 '13 at 10:48

enguerranws

Yes but how. You've stated what he could do but not how to do it. – Liam Dec 27 '13 at 11:03
I gave him a way to do it. SO is not just about giving code to people. I'd rather explain a guy how to do it instead of giving him a working code that he doesn't understand. – enguerranws Dec 28 '13 at 17:51
BTW, as he didn't post any code part, I don't know how I could post code. – enguerranws Dec 28 '13 at 17:52
No SO, is not just about giving code, it's about giving code **and** explaining [why they should do it this way](http://meta.stackexchange.com/a/203848/217110). – Liam Dec 30 '13 at 08:49

2 Answers2