我想延缓页面加载时间，特定的网页 - 在这种情况下，谷歌 - 使用户无法看到该网页，直到倒数计时器已经完成。
这个问题的灵感XKCD ，和一个类似的问题是“一组特定的页面的JavaScript页面加载延迟” 。
我试过乔纳森的Greasemonkey脚本（见下文）修改后的版本，但这个剧本只是延缓谷歌页面加载谷歌首次在一个特定的标签使用。
如果谷歌是在新标签页打开，或者用户遵循从谷歌然后返回一个链接，该脚本再次踢英寸 但是，如果用户没有从过谷歌导航离开（比如，他们发现他们正在寻找在每个搜索结果下的简短摘要答案，然后就寻找别的东西），他们可以没有任何延迟搜索。
有没有办法迫使延迟屏幕的每个搜索（如每次页面访问时间后反对）后出现？ - 优选地使用任一的Greasemonkey或铬插件？
剧本目前使用：
（第一组封端地址的“1”的值和所有其它地址的值“0”，那么，如果块> 0，则脚本踢...）
(function(){
// Note: This doesn't actually stop the page from loading, but hides it, so you know its
// there, waiting; The dopamine of internet candy becomes a torture. Better to clean
// your room or open an irb prompt instead.
window.seconds = 30;
function resetCountDown()
{
seconds = 30;
}
// You can has cybersauce
window.clearDelay = function()
{
document.getElementById('eightSixTwoDelay').style.display = 'none';
}
var overlay = document.createElement('div');
overlay.id = 'eightSixTwoDelay';
overlay.style.backgroundColor = '#000';
overlay.style.color = '#FFF';
overlay.style.fontSize = '56px';
overlay.style.fontFamily = 'Helvetica, Arial, Sans';
overlay.style.fontWeight = 'bold';
overlay.style.textDecoration = 'none';
overlay.style.position = 'absolute';
overlay.style.top = '0px';
overlay.style.left = '0px';
overlay.style.width = '100%';
// clientHeight changes as content loads, and JS, like the PHX Valley Metro system, does not wait for you to run.
overlay.style.height = document.body.clientHeight + 'px'; //'100%';
overlay.style.paddingTop = '10px';
overlay.style.paddingLeft = '10px';
overlay.style.textAlign = 'left';
overlay.style.zIndex = '10000'; // OVER 9000
overlay.addEventListener("click", resetCountDown, true); // THERE IS NO ESCAPE
document.getElementsByTagName('body')[0].appendChild(overlay);
window.displayDelay = function()
{
if (seconds > -1)
{
document.getElementById('eightSixTwoDelay').innerHTML = 'Page ready in ' + seconds + ' seconds.';
seconds -= 1;
setTimeout(window.displayDelay, 1000);
}
else
{
clearDelay();
}
}
window.onload = displayDelay();
})();
}
当进入一个新的搜索，谷歌礼貌地改变URL，以及AJAXing，在新的页面。 因此，监听hashchange事件，以确定新的搜索已运行时。
对剧本的几点思考：
- 使用
@run-at document-start ，以使消隐尽快开始越好。 - 覆盖应
position: fixed; 。 - 避免设置全局或
window. 范围变量，AMAP。
这里是一个空白的每一个新的谷歌搜索页面一个完整的脚本：
// ==UserScript==
// @name _Delay a page display, a la XKCD
// @namespace _pc
// @match http://*.google.com/*
// @run-at document-start
// ==/UserScript==
/*--- Blank the screen as soon as the DOM is available, and also whenever
the URL (hashtag) changes -- which happens when "new" pages are loaded
via AJAX.
*/
window.addEventListener ("readystatechange", FireWhenReady, true);
window.addEventListener ("hashchange", blankScreenForA_While, true);
function FireWhenReady () {
this.fired = this.fired || false;
if ( document.readyState != "uninitialized"
&& document.readyState != "loading"
&& ! this.fired
) {
this.fired = true;
blankScreenForA_While ();
}
}
function blankScreenForA_While () {
/* Note: This doesn't actually stop the page from loading, but hides it,
so you know its there, waiting; The dopamine of internet candy becomes
a torture.
Better to clean your room or open an irb prompt instead.
*/
//--- Settings:
var pageDelaySeconds = 5;
var overlayID = "gmEightSixTwoDelay"
//--- One-time setup, for each new "page", START:
function resetCountDown () {
blankScreenForA_While.secondsRemaining = pageDelaySeconds;
}
resetCountDown ();
function createOverlay () {
var overlay = document.getElementById (overlayID);
if (overlay) {
overlay.style.display = 'block'; // Un-hide.
return;
}
overlay = document.createElement ('div');
overlay.id = overlayID;
overlay.style.cssText = " \
font: bold 56px Helvetica,Arial,Sans; \
text-decoration: none; \
position: fixed; \
top: 0; \
left: 0; \
width: 100%; \
height: 100%; \
z-index: 10000; /* OVER 9000 */ \
margin: 0; \
overflow: hidden; \
color: pink; \
background: lime; \
line-height: 1.5; \
padding: 1em; \
text-align: center; \
";
//--- Only use innerHTML the one time.
overlay.innerHTML = 'Go do something important!<br>'
+ 'Page ready in <span></span> seconds.'
;
// THERE IS NO ESCAPE.
overlay.addEventListener( "click", resetCountDown, true);
document.body.appendChild (overlay);
}
createOverlay ();
//--- One-time setup, for each new "page", :END
// You can has cybersauce
function clearDelay () {
document.getElementById (overlayID).style.display = 'none';
}
function displayDelay () {
if (blankScreenForA_While.secondsRemaining > -1) {
var displaySpan = document.querySelector (
"#" + overlayID + " span"
);
displaySpan.textContent = blankScreenForA_While.secondsRemaining;
blankScreenForA_While.secondsRemaining--;
setTimeout (displayDelay, 1000);
}
else {
clearDelay ();
}
}
displayDelay ();
}//-- End of: blankScreenForA_While()
