css - 在鼠标移出时恢复为原始 CSS

Question

我试图让 AjaxControlToolkit Accordion 控件在鼠标悬停和鼠标移出时更改标题样式。它工作正常，但是当用户将鼠标悬停在当前选定的标题上然后离开它时，选定标题的特殊 CSS 将被我分配的 mouseout 类覆盖。我正在使用 onmouseover="this.className='AccHover'"和 onmouseout="this.className='AccMouseOut'"在<div> Accordion 标题部分内的标记。

有没有办法在 mouseout 事件上删除 AccHover 类，并根据 Accordion Pane 的状态自动恢复为未选择的 CSS 样式或选定的标题样式？

Answer 1

我会使用:

onmouseover="this.classList.add('AccHover')"

和

onmouseout="this.classList.remove('AccHover')"

编辑:好的，我只记得 classList 在 IE 中不起作用，我假设这就是您正在测试的内容。在那种情况下，我会使用类似的东西:

onmouseover="this.className = this.className + 'AccHover';"

和

onmouseout="this.className = this.className.replace('AccHover', '');"

参见示例 http://jsfiddle.net/RgRUN/2/

但我会调用您自己的 javascript 函数而不是内联编写。