CODEWITHSUNDEEP
javascriptjquery
this_guy
this_guy

Reputation: 604

Having trouble getting jqueryrotate to work

I am not having any luck getting jqueryrotate example #2 on this page to work on a simple html page. What am I doing wrong? Thanks for the help.

Here is my code - 

    <!DOCTYPE html>

<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>
<STYLE type="text/css">
 #img { margin:100px 100px;}
</STYLE>
</head>
<body>

<script type="text/javascript">
$("#img").rotate({ 
   bind: 
     { 
        mouseover : function() { 
            $(this).rotate({animateTo:180})
        },
        mouseout : function() { 
            $(this).rotate({animateTo:0})
        }
     } 

});
</script>


<img id="img" src="https://www.google.com/images/srpr/logo3w.png">
</body>
</html>

Upvotes: 1

Views: 742

Answers (1)

Trufa
Trufa

Reputation: 40737

you code works just fine, see here.

You should probably use ready.

$(document).ready(function() {
    $("#img").rotate({
        bind: {
            mouseover: function() {
                $(this).rotate({
                    animateTo: 180
                })
            },
            mouseout: function() {
                $(this).rotate({
                    animateTo: 0
                })
            }
        }

    });
});​

Also, I would not recommend using the id #img it's not that it's wrong, it's just sort of ugly IMO.

Upvotes: 1

Related Questions