CODEWITHSUNDEEP
jquerycssclicktransitionfadeout
Sam Skirrow
Sam Skirrow

Reputation: 3697

jQuery make inline div transition when neighboring element fades out

I have 8 or more divs that are displayed in rows of 3 and are inline-block. When you click a div it fades out and the neighboring div moves into it's pace. Is there a way to make the divs slide across rather than just jump?

See here for my JSfiddle http://jsfiddle.net/xmq2x/

and code here:

$( ".box" ).click(function() {
$(this).fadeOut( "slow" );
});

Upvotes: 0

Views: 70

Answers (1)

DaniP
DaniP

Reputation: 38252

You can try with Jquery animate() like this:

$( ".box" ).click(function() {
  $(this).animate({
      opacity : '0',
      width : '0'
  },function(){$(this).hide()});
});

An example http://jsfiddle.net/xmq2x/14/

Upvotes: 1

Related Questions