# 360 Image Spin on Hover?

**URL:** <https://forum.kirupa.com/t/360-image-spin-on-hover/326327>\
**Category:** web dev\
**Created:** [December 7, 2011, 3:15am UTC](https://forum.kirupa.com/t/360-image-spin-on-hover/326327 "2011-12-07T03:15:21Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![kozmo02](https://avatars.discourse-cdn.com/v4/letter/k/3ab097/32.png) [@kozmo02](https://forum.kirupa.com/u/kozmo02)\
**Post date:** [December 7, 2011, 3:15am UTC](https://forum.kirupa.com/t/360-image-spin-on-hover/326327/1 "2011-12-07T03:15:21Z")

</div>

I have two gear icons, and when you hover over the div I would like for them to spin, I have it working right now using the [http://code.google.com/p/jqueryrotate/](http://code.google.com/p/jqueryrotate/) code, however, I am getting some odd results, in Firefox the rotation is off center, however, in Google Chrome, Safari and IE it works better, this is the code I am using:

```auto

$(document).ready(function() 
{
    $('#how-it-works').hover(
        function()
        {
            $('#small-gear').rotate({animateTo:360,duration:1500})
            $('#large-gear').rotate({animateTo:-360,duration:1500})
        }, function()
        {
            $('#small-gear,#large-gear').rotate({animateTo:0})
        });
});

```

Are there any other cross-browser methods of accomplishing this? I have searched Google but I haven’t had much luck. Please note, the solution has to work in IE as well.