I'm having trouble getting my bounce effect to work when I click on an image using JQuery. It just won't bounce. I've provided my code below.

<script type="text/javascript" src="js/jquery.js"></script>

<a href="#"><img id="cog" src="images/icons/cog.png" alt="User Settings"/></a>

$(document).ready(function() {
    $("#cog").click(function() {
        $(this).effect("bounce", {times: 3}, 500);
    });
});

I'm having trouble getting my bounce effect to work when I click on an image using JQuery. It just won't bounce. I've provided my code below.

<script type="text/javascript" src="js/jquery.js"></script>

<a href="#"><img id="cog" src="images/icons/cog.png" alt="User Settings"/></a>

$(document).ready(function() {
    $("#cog").click(function() {
        $(this).effect("bounce", {times: 3}, 500);
    });
});

• javascript
• jquery
• effect
• bounce

• what version of jquery are you running? – jondavidjohn Commented Apr 13, 2011 at 3:03
• There is no "effect" function in standard jquery library. – Calvin Froedge Commented Apr 13, 2011 at 3:04

2 Answers 2

That's because it's part of the jQuery UI package.

Try adding this line

<script src="http://ajax.googleapis./ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

Effects are part of jQueryUI, not jQuery.