After the animation, the next element is shifted to a certain height and eventually leaves the viewing area. Example code at http://www.2780780.ru/workaround/

    1 answer 1

    I can assume that the text that is inside li leads to this effect - height: 0 and overflow: hidden does not help to completely hide the element, try hiding them in display: none after working off.

    UPD: Added it to the CSA and works in IE6 +, the script itself can be not changed

    li { list-style: none; overflow: hidden; height: 100px; cursor: pointer; background: url("images/bg-sample.png"); float:left; width:100%; } li div { color: #6B5E34; font-size: 2em; font-weight: bold; text-align: center; line-height: 100px; background: url("images/bug.png") no-repeat 8px center; }
    • A solution is added to the example, at the end there is a sharp jump - Amaranthus
    • Yes, {float: left; width: 100%} for li helped solve the problem, thank you. - Amaranthus