CODEWITHSUNDEEP
jqueryjquery-uibounce
Instinct
Instinct

Reputation: 359

jQuery - bouncing effect without changing object's position on screen

Not sure if my html and/or css would be needed to find the issue but I've been calling the bounce effect on images when clicked and it completely changes their position on the screen before/during the bounce. Not sure why this is? I have:

$('img').click(function() {
        $(this).effect('bounce', {times:3}, 300);
});

With images to the right of other divs (including inputs) and the jump to the bottom middle of the screen for their bouncing

edit: here is the jsFiddle: http://jsfiddle.net/ep6wG/1/ (images should bounce)

Upvotes: 0

Views: 1545

Answers (1)

yeyene
yeyene

Reputation: 7380

Check this DEMO http://jsfiddle.net/yeyene/nmy3V/

You can set css like this.

#content {
    float:left;
    width:100%;
    margin:100px 0 0 0;
    background:red;
}
#content img {
    position:absolute;
    width:100px;
    height:120px;
}
#content input {
    float:left;
    margin:50px 0 0 120px;
}
#content div {
    float:left;
    margin:100px 0 0 10px;
}

Upvotes: 1

Related Questions