0

親のオブジェクトからCSSを変更するための解決策を探しています。

私はこれを持っています：

<div class="layout">
   <div class="over"></div>
</div>
<div class="layout">
   <div class="over"></div>
</div>
<div class="layout">
   <div class="over"></div>
</div>
<div class="layout">
   <div class="over"></div>
</div>
<div class="layout">
   <div class="over"></div>
</div>

私のサイトにはそのようなオブジェクトが6つあります。したがってmousenter、DIVでイベントを使用するときに、すべてのレイアウトではなく、親の「レイアウト」をover 変更したいのです。backgroundcolor

私も使えるといいですねmorph()。

4

1 に答える 1

0

親要素を取得するには、getParent関数を使用します。これを別の何かにバインドしたい場合は、関数をに変更してからfunction(e)を使用できますe.target。

アニメーションが実行されている場合にアニメーションをキャンセルする理由は、マウスを少し速く動かすときに醜さを取り除くためです。あなたはそれを削除しようとすることができます。

$$('.over')
.addEvent('mouseenter', function(){
    var parent = this.getParent();
    var tween = parent.get('tween');
    if (tween && tween.isRunning()){
        tween.cancel();
    }
    parent.setStyle('background-color', '#f00');
})
.addEvent('mouseleave', function(){
    this.getParent().tween('background-color', '#fff');
});

これが実際の例のフィドルです：http：//jsfiddle.net/vxQXU/1/

于 2012-12-28T09:01:05.747 に答える