當用戶將鼠標移動到屏幕/圖形上時，自動滾動將暫停。如果鼠標移動停止，自動滾動將再次恢復

你好，我有自動滾動頁面的工作代碼。我需要做一些修改。當用戶在頁面上移動鼠標並且沒有鼠標移動時，需要暫停自動滾動，然後自動滾動將恢復。當用戶將鼠標移動到屏幕/圖形上時，自動滾動將暫停。如果鼠標移動停止，自動滾動將再次恢復

 <script> 
    $("html, body").animate({ scrollTop: $(document).height() }, 400000); 
     setTimeout(function() { 
      $('html, body').animate({scrollTop:0}, 400000); 
     },400000); 
     setInterval(function(){ 
      // it will take 40 secound in total from the top of the page to the bottom 
     $("html, body").animate({ scrollTop: $(document).height() }, 400000); 
     setTimeout(function() { 
      $('html, body').animate({scrollTop:0}, 400000); 
     },400000); 

     },8000); 
    </script>

來源

2016-04-28 Tejas Masurkar

請更新html或給我們一個FIDDLE以獲得適當的幫助.. – Sarath

http://stackoverflow.com/questions/5088766/the-way-to-stop-and-continue-animation-while-mouseover-and -mouseout-in-jquery –

@Sarath http://jsfiddle.net/QUCWe/1605/ –

希望這是你在尋找什麼

var x = 10, 
    y = true, 
    z = 1, 
    maxscroll = 40, 
    mixscroll = 10; 

setInterval(function() { 
    $('html, body').mousemove(function() { 
     z = 0; 
    }); 
    if (z === 0) { 
     setTimeout(function() { 
      z = x; 
     }, 1000); 
    } else { 
     z = x; 
     if (y) { 
      $('html, body').animate({ scrollTop: ($(window).scrollTop() + z) + 'px' }, 300); 
      x++; 
     } else { 
      $('html, body').animate({ scrollTop: ($(window).scrollTop() + -(z)) + 'px' }, 300); 
      x--; 
     } 
    } 

    if (maxscroll < x && y) { 
     y = false; 
    } else if (x < mixscroll) { 
     y = true; 
    } 
}, 500);

https://jsfiddle.net/donS/9xdz86yu/

來源

2016-04-28 07:28:22 user6250141

就是這樣。但是，在達到谷底後，你的網頁不會再上漲。檢查此jsfiddle.net/QUCWe/1605 –

我沒有花錢，使其完美只是概念，請檢查更新希望這個幫助 – user6250141

你可以在jQuery的像使用.stop()功能..

$("html, body").mouseover(function(){ 
      $(this).stop(); 
});

試試這個FIDDLE

來源

2016-04-28 09:35:52 Sarath

當用戶將鼠標移動到屏幕/圖形上時，自動滾動將暫停。如果鼠標移動停止，自動滾動將再次恢復

回答

相關問題