0

このコードは機能していません。何が間違っていますか?

Tnks。

 var x;
    x=jQuery(document);
    x.ready(inicializarEventos);

    function inicializarEventos()
    {
      var x;
      x=jQuery(".Caja2");
      x.hover(entraMouse,saleMouse);
    }


    function entraMouse()
    {
      jQuery(".Caja2").stop().fadeOut();
    }

    function saleMouse()
    {
      jQuery(".Caja2").stop().fadeIn();
    }
4

2 に答える 2

4

マウスを上に置くとフェードアウトし、マウスを離すと再び表示されるボックスが必要なようです (私には)。これは実際には、最初に表示されるよりもトリッキーです。

を呼び出すと$().fadeOut()、jQuery がフェードをアニメーション化し、display: noneその要素に設定します。その後、要素が表示リストから削除されるため、mouseOut イベントが発生し、当然、fadeIn() 効果が開始されます。これにより、マウスがその領域に置かれている限り、イベントmouseInとイベントの無限ループが発生します。mouseOut

あなたが試してみたいと思うかもしれないことは、$().fadeTo()メソッドを使用することです。opacity次の例では、マウスが入るとプロパティを 0.0 にアニメーション化し、マウスが離れると 1.0 に戻します。要素が実際に非表示になることはありません (単に非表示になるだけです) ため、mouseOutイベントは正しく発生します。

jQuery(document).ready(inicializarEventos);

function inicializarEventos() {
    $(".Caja2").hover(entraMouse, saleMouse);        
}

function entraMouse() {
    jQuery(this).fadeTo("slow", 0.0)
}

function saleMouse() {
    jQuery(this).fadeTo("slow", 1.0)
}

将来的には、「コードが機能していない」と考える理由を説明することをお勧めします。コードがどのように機能すると予想されるか、および現在の結果が何であるかを定義する必要があります。それは、他の人があなたの質問に答える方法をよりよく知るのに役立ちます.

于 2009-07-16T22:20:01.347 に答える
1

コメントからのDreas Grechは正しいです。.stop() メソッドを呼び出す前に、要素がアニメーション化されているかどうかを確認する必要があります。これを試して：

function entraMouse() { jQuery(".Caja2:animated").stop();jQuery(".Caja2").fadeOut(); }
function saleMouse() {jQuery(".Caja2:animated").stop();jQuery(".Caja2").fadeIn(); }
于 2009-07-16T21:55:35.683 に答える