Как сделать спойлер с открытием при наведении мыши?

Question

[web11]

Здравствуйте!

Есть заготовка рабочего спойлера с открытием по клику
cssdeck.com/labs/ce9yegtq

Нужно изменить скрипт, чтобы спойлер открывался при наведении мыши.
Закрытие спойлера - автоматически при убирании мыши с заголовка и текста внутри спойлера.
Также нужно предусмотреть задержку открытия и скрытия спойлера.

Задача - реализовать блок выпадающего меню, как на сайте eldorado.ru.

Буду благодарен за решение!

Answer 1

[Александр]

Ну тут все просто - cssdeck.com/labs/wixjgejr

Answer 2

[Александр]

Обновил :)

Answer 3

[Александр Хиренко]

Вам даже jQuery не нужен для такой задачи
cssdeck.com/labs/jdglddmx

Answer 4

[Виталий Киренков]

кнопа.hover(function(){
контейнер.slideToggle()
})

Answer 5

[web11]

Satanpit, спасибо, но в этом случае не будет эффекта скольжения

DeLaVega, спасибо.
В скриптах не разбираюсь, к сожалению (
Заменил код на

jQuery(document).ready(function(){
		jQuery('.spoiler-text').hide()
		jQuery('.spoiler').hover(function(){
			jQuery(this).toggleClass("folded").toggleClass("unfolded").next().slideToggle()
		})
	})

Теперь текст внутри спойлера появляется при наведении на заголовок, но пропадает при наведении на содержание спойлера.

И еще важен вопрос с задержкой открытия и сворачивания спойлера, чтобы он постоянно не открывался если пользователь просто через него проведет мышку
Как это можно решить?

Comments

[Виталий Киренков]

Раз не разбираетесь, отдавайте на фриланс, а не просите, чтобы кто то за вас это сделал за просто так...
Делайте ховер по обёртке. А задер;ка через .delay()
Дальше ищите сами, направление в котором копать я дал.

Answer 6

[web11]

neokortex, спасибо!
все отлично работает!

остался только вопрос с задержкой открытия и скрытия

попробовал добавить для примера .delay(3000) к .slideUp()
задержка появилась, но возникла другая проблема:
если просто провести мышкой, не задерживая ее на кнопке, то спойлер все равно открывается после окончания времени задержки

хотелось бы сделать так, чтобы он открывался если курсор находится определенное время над заголовком спойлера

Answer 7

[web11]

neokortex, огромное спасибо!
все работает так, как и хотелось изначально!