jquery переключать изображения при наведении - PullRequest
Новая
       34

jquery переключать изображения при наведении

0 голосов
/ 23 марта 2012

Я получил много div с классом 'Thumbnails', который содержит 5 изображений, подобных этому 

<div class='thumbnails'>

    <img src='image1.jpg' />
    <img src='image2.jpg' />
    <img src='image3.jpg' />
    <img src='image4.jpg' />
    <img src='image5.jpg' />

</div>

CSS: 

.thumbnails{ position:relative; }
.thumbnails img{ position:absolute; top:0px; left:0px; }

Каждое изображение имеет положение: абсолютное; поэтому по умолчанию image1 находится сверху

Что я хочу сделать, это

Когда посетитель наводит курсор на div «thumbnails», он показывает / переключает каждое изображение «Что-то вроде ползунка», а при наведении мыши возвращает изображение по умолчанию (image1) и т. Д. Для каждого div «Thumbnails»

Вся помощь будет оценена

1 Ответ

0 голосов
/ 23 марта 2012

Похоже, что вы хотите связать событие .mouseenter () с #thumbnails, которое вызывает функцию, которая использует .animate ().Затем эта функция может запустить анимацию, затем завершить ('# image' + counter) и снова запустить функцию.(вы также можете создать setInterval для этого, чтобы он работал вместо завершения). Просто сделайте так, чтобы вы установили переменную, которая обнаруживает .mouseleave (), чтобы остановить цепочку анимации, запускаемую .mouseenter ()

Документы:

http://api.jquery.com/mouseenter/

http://api.jquery.com/mouseleave/

http://api.jquery.com/animate/

...