我想延迟特定网页(在本例中为Google)的页面加载时间,以便用户在倒数计时器完成之前无法看到网页。
这个问题的灵感来自xkcd,类似的问题是"Javascript page load delay of specific set of pages"。
我已经尝试过Jonathan的Greasemonkey脚本的修改版本(见下文),但是这个脚本只会在Google首次使用特定标签时延迟Google页面加载。
如果Google在新标签页中打开,或者用户跟随Google的链接然后返回,则脚本会再次启动。但是,如果用户没有离开谷歌(比如,他们在每个搜索结果下找到他们在简短摘要中寻找的答案,那么只需搜索其他内容),他们就可以毫不拖延地进行搜索。
有没有办法强制延迟屏幕在每次搜索后出现(而不是每次访问页面后)? - 最好使用Greasemonkey还是Chrome插件?
目前使用的脚本:
(首先将阻止的地址设置为值“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();
})();
}
答案 0 :(得分:1)
当输入新搜索时,Google会礼貌地更改新页面中的URL以及AJAXing。因此,请监听hashchange
事件以确定何时运行新搜索。
关于该剧本的一些随机说明:
@run-at document-start
以便尽快开始消隐。position: fixed;
。window.
范围变量,AMAP。以下是一个完整的脚本,可以在每次新的Google搜索中清空页面:
// ==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()