css - 多里同时激活效果

Question

我有一个场景，当我将鼠标向下移动到一个 li 元素上，同时鼠标移动到其他 li 元素上时，为此调用 css active。就像我们同时按下多个键的钢琴。并为所有这些事件展示效果。

感谢并抱歉我的英语不好。

Answer 1

首先，如果使用 CSS 按下鼠标按钮，则无法跟踪，无论如何都需要 JS。例如检查 JQuery mouse events documenattion .

其次，我认为“类似钢琴”的行为意味着您需要按键，而不仅仅是将手指放在上面。鼠标光标让您成为“单指钢琴家”。所以，如果我的想法正确(我不确定)，这里有一个简单的 JQuery 片段，您可以从这里开始:

$('li').on('click', function(){
    $(this).toggleClass('active');
})

在此处查看实际效果:https://jsfiddle.net/uL5506xg/