user_2327
user_2327

Reputation: 5

Hide a div near the button when button gets clicked

Ok, so I have this div with 100% height and 100% width and I have button centered into that div. Now when user clicks that button. I want the div to collapse near button and hide. Here is my code. and you can also see that on JS Fiddle

http://jsfiddle.net/ZxB4Z/

$('button').click(function(){
$("div").animate({
  left:'24%',
  top:'48%',
  opacity:'0',
  height:'0px',
  width:'0px'
},'slow');});

Upvotes: 0

Views: 116

Answers (1)

yckart
yckart

Reputation: 33438

Use margin instead of position properties (top/left):

$('button').click(function(){
    $("div").animate({
        marginLeft:'24%',
        marginTop:'48%',
        opacity:'0',
        height:'0px',
        width:'0px'
    },'slow');
});

or apply position absolute on your div:

div { position: absolute }

Upvotes: 1

Related Questions