CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Joe Bobby
Joe Bobby

Reputation: 2811

How To Hide Div Padding Until Visible?

If you goto http://jsfiddle.net/BT4Bk/ you can see that the dark bar is visible.

This is padding for the #ajax div that will wrap the content inside. How do I hide the padding so its not displayed until it slides into view with the content?

Upvotes: 1

Views: 1395

Answers (3)

Sameera Thilakasiri
Sameera Thilakasiri

Reputation: 9508

You need to remove the 

#ajax{
    padding: 0px 0; // padding value from here
}

Same to added $(".viewproject").click(function ()

$('#ajax').css("padding-top",40);

So all time padding is not taken when you request the item required padding set using jQuery. Here @Kiran done is absolutely correct.

Upvotes: 0

Devin Burke
Devin Burke

Reputation: 13820

Hide your #dark until the link is clicked. I added #dark { display: none; } to the CSS and $('#dark').show() to your animate function:

http://jsfiddle.net/tU3jr/

This jsFiddle will prevent the black padding from shown before the animation runs.

Upvotes: 2

Kiran
Kiran

Reputation: 20313

Once you click on the Item 1 padding-top is updated.Look into the following updated fiddle:

http://jsfiddle.net/BT4Bk/3/

Upvotes: 1

Related Questions