jQuery Bounce In Place

Question

Мне нужны элементы списка элементов, чтобы они подпрыгивали на месте и не падали друг на друга.

Я создал JSFiddle, что я имею в виду: http://jsfiddle.net/RGvjj/

Может кто-нибудь посоветовать мне, почему эти элементы делают это, и что мне нужно сделать, чтобы исправить это?

Answer 1

Попробуйте удалить inline дисплей из <li> и используйте вместо этого float:left.

Попробуйте:

#navigation li { 
    font-size: 20px; 
    margin-left: 10px; 
    padding-left: 10px; 
    border-left: 3px solid #1161A5; 
    color: #ffffdd; 
    text-decoration: none; 
    float:left; 
} 

---

EDIT: Чтобы объяснить, я предполагаю, что это происходит потому, что, когда вы живой элемент, JQuery изменяет display к block. Таким образом, вы попали в элемент block (<a>) внутри элемента inline (<li>), который не работает.

Используя float:left, то <li> сохраняет block дисплей, что делает его действительным для <a> быть block.