0

alt text

Есть код JS:

$('#navigationa li').hover(
    function(){
        $(this).stop(true).animate({height:'60px'}, 500, 'easeOutBounce')  
    },
    function(){
        $(this).stop(true).animate({height:'20px'}, 500, 'easeOutCirc')
    }
);

HTML:

<ul id="navigationa">
    <li><a href="#">go go go1</a><img id='lol' src="img/kiska.jpg" alt=""></li>
    <li><a href="#">go go go2</a><img id='lol' src="img/kiska.jpg" alt=""></li>
    <li><a href="#">go go go3</a><img id='lol' src="img/kiska.jpg" alt=""></li>
    <li><a href="#">go go go4</a><img id='lol' src="img/kiska.jpg" alt=""></li>
</ul>

Нужно что бы при наведении на #navigationa li картинка появлялась с блоком.А у меня она сразу видна. Уже 4 часа ломаю голову. Подскажите как сделать или направьте на правильное решение. Спасибо !

ВОТ ССЫЛКА НА ПРИМЕР ! http://jsfiddle.net/ad8zr/3/

4
  • 4
    Вот вы ломаете голову над кодом, а я уже несколько минут ломаю голову над вашим вопросом )) Ничо не понятно. Сформулируйте задачу как-то более понятным языком и не плохо бы выложить код на jsfiddle.net. И не только html + js, но и css тоже б не помешало.
    – Deonis
    28 дек 2012 в 23:51
  • У img выставьте в css display: none, а при наведении на { #navigation li } с помощью jQuery выставляйте display: block; 29 дек 2012 в 1:41
  • 2
    зачем тут jQuery и animate? CSS вам на что? Псевдоселектор :hover для кого? Кому придумали transition?
    – Bars
    29 дек 2012 в 7:58
  • вот так у вас не будет работать $('#navigationa li'), а вот так может $('#navigationa li а') но только с первым элементом. Но чтоб все сработала нужно добавить атрибут data="".
    – bemulima
    29 дек 2012 в 14:44

1 ответ 1

1

Добавляем правило:

#navigationa li{
    /* ... */
    overflow: hidden;
}

И подкорректируем картинки

#navigationa li img {
    position: relative;
    top: 5px;        
}

И вот то, что имеем на выходе. Надо же было столько мучаться? Сразу бы выложили код - быстрее бы ответ получили. ))

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.