懸停時不要淡出

當沒有鼠標移動時，此腳本會淡出div「＃box1」。當光標位於div「＃box1」上時，我試圖強制它不會淡出，並且如果在div外沒有鼠標移動，則繼續淡出。我試過如果/ else語句爲mouseover（），但我似乎無法讓它正常工作。懸停時不要淡出

可能有人請點我朝着如何找出我的傻問題http://jsfiddle.net/YjC6y/2877/

太感謝您了

$(function() { 
    var timer; 
    var fadeInBuffer = false; 
    $(document).mousemove(function() { 
     if (!fadeInBuffer) { 
      if (timer) { 
       console.log("clearTimer"); 
       clearTimeout(timer); 
       timer = 0; 
      } 

      console.log("fadeIn"); 
      $('#box1').fadeIn(); 
      $('html').css({ 
       cursor: '' 
      }); 
     } else { 
      fadeInBuffer = false; 
     } 


     timer = setTimeout(function() { 
      console.log("fadeout"); 
      $('#box1').fadeOut() 
      $('html').css({ 
       cursor: 'none' 
      }); 
      fadeInBuffer = true; 
     }, 1500) 
    }); 
});

來源

2015-09-11 Fr33

對不起再次..你有一個div ..關於mouseover div保持正常就像加載和如果鼠標然後div淡出權嗎？ – daremachine

試試這個：這裏是小提琴鏈接：jsfiddle.net/b04jsmkf

加入：

if (!$('#box1').is(':hover')) {

完整功能：

 $(function() { 
      var timer; 
      var fadeInBuffer = false; 
      $(document).mousemove(function() { 
       if (!fadeInBuffer) { 
        if (timer) { 
         console.log("clearTimer"); 
         clearTimeout(timer); 
         timer = 0; 
        } 

         console.log("fadeIn"); 
        $('#box1').fadeIn(); 
        $('html').css({ 
         cursor: '' 
        }); 
       } else { 
        fadeInBuffer = false; 
       } 


       timer = setTimeout(function() { 
        console.log("fadeout"); 
        if (!$('#box1').is(':hover')) { 
         $('#box1').fadeOut() 
         $('html').css({ 
          cursor: 'none' 
         }); 
         fadeInBuffer = true; 
        } 
       }, 1500) 
      }); 
     });

來源

2015-09-11 21:55:59 Aram

亞拉姆打敗了我，我正要發佈這個小提琴：http://jsfiddle.net/b04jsmkf/ –

@Aram，你有一個小提琴嗎？ –

@SomayehGhazvinian Gregg只是把它放在評論中... – Aram

固定，只是在#box上添加了mousemove檢查。

$(function() { 

var timer; 
var isOnBox = false; 
var fadeInBuffer = false; 



$("#box1").mouseenter(function(){; 
    isOnBox = true; 
}).mouseleave(function(){ 
    isOnBox = false; 
}); 


$(document).mousemove(function() { 
    if (!fadeInBuffer) { 
     if (timer) { 
      console.log("clearTimer"); 
      clearTimeout(timer); 
      timer = 0; 
     } 
     console.log("fadeIn"); 
     $('#box1').fadeIn(); 
     $('html').css({ 
      cursor: '' 
     }); 
    } else { 
     fadeInBuffer = false; 
    } 

    timer = setTimeout(function() { 
     console.log(isOnBox); 
     if(isOnBox==false){ 
      console.log("fadeout"); 
      $('#box1').fadeOut() 
      $('html').css({ 
       cursor: 'none' 
      }); 
      fadeInBuffer = true; 
     } 
    }, 1500) 

}); 
});

來源

2015-09-11 22:05:51

懸停時不要淡出

回答

相關問題