css - 表示され、しばらくすると消え、ホバリングすると表示されるDiv...

Question

表示され、しばらくすると消え、ホバリングすると表示される div をコーディングしようとしています.. www.aedas.com でライブの例を見ることができます - 左ペインがスライドインしてから消え、その領域にカーソルを合わせるとそれは再び現れます。

どうもありがとうございます！

Answer 1

次のような簡単なことを試すことができます：

バーを非表示にする間隔を設定するために setInterval と clearInterval を使用しています。

重要な注意点

setInterval によって返された id は、clearInterval で使用する必要があります。そうしないと、ループが壊れません!!

jsfiddle の作業: http://jsfiddle.net/frictionless/QmLAv/

$(function() {

   var showTime = 5000;
   var transition = 'slow';
   var target = $('.headerbar');
   var flag = false;

    target.slideDown(transition);
    var id = setInterval(function(){hide(target);}, showTime);

    var hide = function(item) {
        debugger;
        if(flag){
            return;
        }
        clearInterval(id);
        item.slideUp(transition);
    };

    target.hover(function() {
        flag = true;
        clearInterval(id);
        $(this).show();
    }, function() {
        flag = false;
        id = setInterval(function(){hide(target);}, showTime);
    });

});​