Runtime Terror
Runtime Terror

Reputation: 6742

Element height increased after .animate() function

I created the following accordion slider:

JSFiddle demo

After I click on one of the list items, it triggers the .animate() function. My problem is, that after animation start rendering, the browser scroll-bar appears on the side for just a second. This is because the height of the list items increased a bit, but I can't figure it out why is it doing this.

Upvotes: 0

Views: 33

Answers (1)

lmgonzalves
lmgonzalves

Reputation: 6588

You need to set overflow: hidden on the #vaccordion element, and also height. In this case I set the height in percent, so you need also define a height to the parents of #vaccordion too (html, body).

html, body{
    width: 100%;
    height: 100%;
}

#vaccordion {
    list-style: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

FIDDLE: https://jsfiddle.net/8a5dsaqx/2/

Upvotes: 1

Related Questions