3

色付きの画像を表示するホバーオーバーアクションを作成しようとしています。また、ホバーが削除されると、元の画像にフェードバックします。

このフォーラムのファンカとブラッドの助けを借りて、最初の画像でフェードインするところまで行きましたが、ホバーオフするとフェードアウトするように取得する必要があります。

現在、画像をフェードアウトして何も表示せず、新しい画像をフェードインします。ホバーオフするかどうかに関係なく、これはそのまま残ります。

私はそれが好きなので、フェードインする前に0にフェードするのと同じように、カラー画像が白黒のものをフェードしているように見えます...ホバーが削除されると元に戻ります。

どんな助けでも大歓迎です。 

//Loop through the images and print them to the page
   for (var i=0; i < totalBoxes; i++){
    $.ajax({
     url: "random.php?no=",
     cache: false,
     success: function(html) {
      // following line I originally suggested, but let's make it better...
      //$('#bg').append(html).fadeIn('slow');
      // also note the fine difference between append and appendTo.
      var $d = $(html).hide().appendTo('#bg').fadeIn('slow');
      $('img', $d).hover(function() {
       var largePath = $(this).attr("rel");
       $(this).fadeOut("slow", function() {
        $(this).attr({ src: largePath }).fadeIn("slow");
       });
      });
     }
    });
   }
4

2 に答える 2

1

ホバーにはマウスオーバー機能しかありません-マウスアウトで何かをするために...

$('img', $d).hover(function() {
    //This is the mouseover function
    var largePath = $(this).attr("rel");
    $(this).fadeOut("slow", function() {
        $(this).attr({ src: largePath }).fadeIn("slow");
    }
    );
},
function() {
    //This is the mouseout function!  Do something here!
});
于 2009-11-05T22:34:36.257 に答える
0

jQueryについてはよくわかりませんが、私が使用しているものと、あなたが求めているもののように聞こえる場合は、次のコードをご覧ください。一部のブラウザで発生する迷惑なちらつきを防ぐために、スプライト画像で使用します。 

$(function() {
    $(".fadebtn")
    .find("span")
    .hide()
    .end()
    .hover(function() {
            $(this).stop(true, true).find("span").fadeIn(600);
    }, function() {
            $(this).stop(true, true).find("span").fadeOut(200);
    });
});
于 2011-11-03T07:48:14.290 に答える