当孩子盘旋并点击时，样式父母

Question

我正在使用一个标签导航脚本，它将一个类分配给所选标签和一个悬停在其上的标签。对于我的特定布局，我需要使用tab功能来处理每个li中的跨度。

<li class="tabs tab1"><span>Tab one</span></li>

选项卡脚本在单击时为跨度分配一个类

<li class="tabs"><span class="selected">Tab one</span></li>

当它徘徊在

之上

<li class="tabs"><span class="hover">Tab one</span></li>
<li class="tabs"><span class="selected hover">Tab one</span></li>

点击或悬停li时，我需要更改父span的背景。 理想情况下，这应该在不更改moo_tabcontrol.js 脚本的情况下完成，并且不使用jQuery 。我会非常感谢这里的任何帮助，因为我是非常文盲，如果来到Javascript。非常感谢。

以下是整个设置：http://jsfiddle.net/spirelli/3a69W/6/

我认为也许父母也可以被指定为“选定”或“悬停”作为一个类（包括此方案的CSS）。但是可能有一个更聪明的选择？

Answer 1

嗯，你可以做一个简单的事情：

.tabs:hover {background-image:url('http://jsfiddle.net/img/logo.png');}

或者更好的答案：在你的JS中只需更改：

tabs: s.getElements('span'),

到

tabs: s.getElements('.tabs'),

比添加：cursor：指向.tabs的css

http://jsfiddle.net/3a69W/9/

Answer 2

看看以下是否有效：

[http://jsfiddle.net/ajays_jsfiddle/3a69W/13/][1]

所有HTML，CSS和JS都进行了更改。