javascript - Centering div using jQuery -



javascript - Centering div using jQuery -

i have div $("#organizer_listings_container") centered using css margin: 0 auto; uses jquery increment width when user clicks on button. after resizing, i'm using next code center resized div $("#organizer_listings_container").

resizing code

// center content when width changes if($("#organizer_listings_container").css("position") != 'absolute') { $("#organizer_listings_container").css("position","absolute"); var left = ( $(window).width() - $("#organizer_listings_container").width() ) / 2 + "px"; $("#organizer_listings_container").css('left', left); // set initial 'left' } left = ( $(window).width() - ( 852 ) ) / 2 + "px"; $("#organizer_listings_container").animate({'left': left}); // animate final 'left'

problem: when add together new div (make visible using jquery show()), appear above #organizer_listings_container, #organizer_listings_container shifts downwards correct. when remove newly added div, #organizer_listings_container not shift up!

i suspect due absolute positioning required jquery centering code used. how can create resized div shift when newly added div removed?

using jquery calculate height of newly added div shifting resized div offsetting top calculated height appears messier want

you can avoid having utilize jquery , add together class newly added div , centre top displacement so:

<div class="container" style="background:blue; width:100%;"> <div class="box" style="background:green; width:50px; height:40px; margin: 0 auto; margin-top:20px;"></div> </div>

note class contain inline style, example.

the thing might need jquery ensure container 100% height. if you're going see box , you're using container positioning centered, don't need requirement.

javascript jquery css

Comments

Popular posts from this blog

How do I check if an insert was successful with MySQLdb in Python? -

delphi - blogger via idHTTP : error 400 bad request -

postgresql - ERROR: operator is not unique: unknown + unknown -