如何複製Mac OS X與jQuery淡出「屏幕保護程序」？

你知道如何在大約2-3分鐘沒有活動的Mac電腦上淡出屏幕部分—在iOS上是一樣的嗎？那麼，我想用jQuery在網頁上覆制它。如何複製Mac OS X與jQuery淡出「屏幕保護程序」？

我知道如何使它淡入淡出，但我不知道如何在2或3分鐘沒有鼠標移動或按鍵後實際工作。

我在Google上研究過這一點，我只是不斷收到「如何在Mac OS X上顯示網頁作爲屏幕保護程序」，這不是我想要的。

任何人都知道如何做到這一點？

謝謝。

來源

2011-10-09 Nathan

的iOS變淡屏幕亮度。你不能在jQuery中做到這一點。 – SLaks

發佈您的現有代碼 - 也許在jsfiddle.com（如果適用） –

@SLaks好吧，我只需要在頁面上淡出div。但我的問題是如何在沒有活動後做到這一點。 – Nathan

像這樣（未測試的）

// set the last event time to now on page loading 
var lastEvent = new Date(); 

function fadeOut(){ 
    // your fade out routine 
} 

// bind appropriate events to everything 
$('*').bind('keydown mousemove mousedown',function(){ 
    // set the lastEvent time to now after any event 
    lastEvent = new Date(); 
}) 

// run this every second 
setInterval(function(){ 
    // get current time 
    var now = new Date(); 
    // compare to last event (minus 2 mins) and fade out if it was long enough 
    if(lastEvent < now - (2 * 60 * 1000)) 
     fadeOut() 
},1000)

來源

2011-10-09 16:21:29

工作！非常感謝:)在這裏看到它：http://jsfiddle.net/6Wy2u/ – Nathan

這似乎佔用了大量的CPU，它有時凍結了網站，它通常總是會使它變得遲緩。你的其他代碼會這樣做嗎？我改變了它每隔100秒就做一次，但過了一段時間它仍然混亂。 – Nathan

如果他們中的任何一個使頁面滯後，或者因爲沒有while循環而消耗CPU，並且不執行大量代碼，我會感到驚訝。我可以想象的唯一消耗 - 對所有東西都是有約束力的 - 如果你有很多元素的話。你確定這個代碼會讓它變得遲鈍嗎？ –

處理和mousemove事件，清除超時，然後設置超時在2分鐘內淡出。

來源

2011-10-09 16:14:21 SLaks

像這樣未經測試的代碼：

function fadeOut(){ 
    // your fade out routine 
} 

// initialise the set timeout function to run fade out after 2 seconds 
var x = setTimeout(function(){ 
    fadeOut() 
},2000) 

// bind appropriate events to everything 
$('*').bind('keydown mousemove mousedown',function(){ 
    // clear the existing timeout and re-set it starting from now 
    clearTimeout(x) 
    x = setTimeout(function(){ 
     fadeOut() 
    },2000) 
})

來源

2011-10-09 16:38:26

謝謝，我用過你的其他代碼，它完美的工作！我沒有嘗試過這個。 – Nathan

快樂的日子 - 只是爲了記錄，這裏也是這個方法的工作版本：http://jsfiddle.net/JdmPB/ –

如何複製Mac OS X與jQuery淡出「屏幕保護程序」？

回答

相關問題