CODEWITHSUNDEEP
jquery
masih arastooyi
masih arastooyi

Reputation: 545

how change width in jquery in 10 sec or more

i have jquery code like this:

$(function() {
$('#butt1').click(function(){
    $('#jabe1').css("width", "300px");
    
});
});

i want #jabe1 width change in 10 sec not in 0 sec after clicked
like:

$('#jabe1').hide(200);

its slowly going to hide
i want #jabe1 width going bigger like that hide

jabe1 css code:

#banners li {
    float: left;
    height: 411px;
    width: 268px;
    margin: 0px 0px 0px -50px;
    position: relative;
    background: url("../images/banner-shadow.png") no-repeat scroll center bottom transparent;
    padding: 0px;
    font-style: normal;
}

Upvotes: 0

Views: 96

Answers (2)

Aiias
Aiias

Reputation: 4748

Try using jQuery's animate().

Javascript code

// Shrink the width
$('#jabe1').animate({width: '0px'}, 10000);

// Expand the width
$('#jabe1').animate({width: '300px'}, 10000);

Upvotes: 3

Nagarjun
Nagarjun

Reputation: 2476

Use animate to make it big

$("#jabe1").animate({
    width: "150%",
}, 1500 );

Set the width to more than what it has currently so that it will expand. If you set the width to less than what it has currently, it will shrink.

To know more about animate function see jQuery animate().

Upvotes: 1

Related Questions