javascript - マウスがページ上のどこにあるかに応じて、異なる画像がフェードイン/フェードアウトします

Question

jQueryまたはJavascriptを使用して、マウスが左上にあるかどうかに応じて、それぞれが個別にすばやく（1000ミリ秒など）フェードインし、ゆっくり（4000ミリ秒など）フェードアウトする4つの異なる画像を作成する方法があるかどうかを確認しようとしています。右上、左下、右下の象限。画像は対応する象限でフェードイン/フェードアウトしますが、より中心に向かっています (したがって、すべての画像が同時にフェードインすると、部分的に重なります)。画像は body タグ内のすべての背後にある必要がありますが、html でレンダリングされた空白や不透明なものには表示されます。これは可能ですか？

Answer 1

$(function(){

    var width=$(window).width();
    var height =$(window).height();
    $('.image_container').css('marginLeft',''+((width-400)/2)+'px');
    $('.image_container').css('marginTop',''+((height-400)/2)+'px');


    $(".conner_boxes").mouseenter(function(){
        $('.image_container > img').eq($(this).index()).animate({opacity:.2});
    }).mouseleave(function(){
        $('.image_container > img').eq($(this).index()).animate({opacity:1});
    });                      


});

これはあなたが望む方法ですか？http://jsfiddle.net/Aveendra/hp8xP/フィドルをチェック