Rotate images by clicking a button

javascript, jquery

Solution

$('input').click(function(){
    var img = $('img');
    if(img.hasClass('north')){
        img.attr('class','west');
    } else if(img.hasClass('west')){
        img.attr('class','south');
    } else if(img.hasClass('south')){
        img.attr('class','east');
    } else if(img.hasClass('east')){
        img.attr('class','north');
    }
});

Fiddle: http://jsfiddle.net/JkHqa/

** Look at the JQuery animate function if you want to incorporate animation

Problem

I want to rotate an image 90 degrees, 180 degrees and 360 degrees on button click. ``` <img class="test" id="image" src="images/image" alt="This is the Display Image" /> ``` I have used this script and I don't liked it because it just displays one single rotation... ``` $(document).ready(function() { $('#image').rotate({maxAngle:25,minAngle:-55, bind: [ {"mouseover":function(){$(this).rotateAnimation(85); } }, {"mouseout":function(){$(this).rotateAnimation(-35); } } ] }); }); ```

Original source