Я использую гармошку для навигации, и мне нужно, чтобы каждый элемент становился активным при наведении мыши, но при наведении мыши первоначальный активный элемент должен расширяться вместо последнего зависшего.
Это то, что яm пытаюсь:
<div id="accordion">
<h3 id="item-1">Item 1</h3>
<div id="item-1-content">Item 1 content</div>
<h3 id="item-2">Item 2</h3>
<div id="item-2-content">Item 2 content</div>
<h3 id="item-3">Item 3</h3>
<div id="item-3-content">Item 3 content</div>
</div>
И js:
$("#accordion").accordion({
event: "mouseover",
active: "#item-1",
collapsible: false
}).mouseout(function() {
$(this).accordion('option', 'active', '#item-1');
});
При загрузке страницы содержимое # item-1 расширяется, как и должно быть.Если я наведу указатель мыши на # item-2, # item-2-content развернется и # item-1-content сократится, как и должно быть.Когда я перемещаю мышь за пределы аккордеона, # item-1-content должен снова стать расширенным элементом, но этого не происходит.
Если я опускаю функцию обратного вызова mouseout, последний элемент hovered остаетсяактивный.Если я оставлю это таким образом, «mouseout» будет запущен, даже если вы на самом деле не «покинете» аккордеон из-за барботирования событий, приводящего к странному поведению.Есть ли способ достичь этой функциональности с помощью сочетания опций аккордеона?