开发者

Javascript page load delay of specific set of pages

I want to delay a specific set of webpages using a small greasemonkey script. Basically, if the website being loaded is part of a set of pages, then I want to delay the time the page takes to load. e.g. if the page being loaded is "http://www.a.com/","http开发者_开发问答://www.a.com/b", etc. then I want to delay the load by 30 secs.


Assuming that Dushara's comment is correct:

"See xkcd.com/862 for what the poster wants. (Hover the mouse over the image to see the reasoning). In fact, I found this question while googling for exactly the same thing."

Then this is not possible in Greasemonkey. The reason is that GM fires after the page has loaded (except for any slow pictures or AJAX calls). So the user would see the page and then it would, say, flash blank for 30 seconds... But, only after quick eyeballs would have seen too much. ;)

Update: This is now possible in Greasemonkey (with the @run-at document-start directive -- Added August 2011). See this answer for an example.


Note that XKCD's creator uses good, old-fashioned willpower to implement his "simple 30-second delay". From his blog entry:

"Lots of people have asked me for the system I used to implement the restriction in the alt-text of today’s comic.
...
I made it a rule that as soon as I finished any task, or got bored with it, I had to power off my computer."

See also: "Browser extension (or other software) to delay page load" -- which now has links to proper extensions that people created for this.


If your reasoning is that you need some time for some elements to load before greasemonkey sees it as loaded, you could always set up an eventlistener that fires off your function when you click instead of on load then when you are ready to have the function fire off you merely have to click on the page somewhere. addEventListener("click", function, false)

If you are merely looking for a way to make it so that pages load automatically after a set amount of time you would have much better luck using imacros.


There exist Greasemonkey scripts that use overlays to do this: Script #1 (works on one website)

I had tried to modify this and came up with something very rough that works with a list of multiple websites: Script #2. I no longer use the add-on because the script had weird side-effects on certain websites and could affect performance. I'm sure somebody else could do a much better job, but it's out there if you want to try it yourself or try to modify it.

For anybody not familiar with Greasemonkey, it is a Firefox add-on that allows you to modify websites with little snippets of javascript that you can write yourself or install from a library. To use either of these scripts, you of course need to install the Greasemonkey add-on (https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/) (not linked due to a lack of rep - anybody with edit privileges please feel free to link).


As mentioned, GreaseMonkey scripts are executed on DOMContentLoaded, so after the page loads.

But well, in fact you can create a overlay <div> for certain number of seconds and it will have the same effect.

Here is a bit improved version of userscripts linked by @Jonathan (in fact, I wrote it by myself independently ;)

(function()
{
   var timeout = 30;
   var timeElapsed = timeout;

   function hide()
   {
      document.documentElement.style.overflow = "hidden";
      var newdiv = document.createElement('div');
      newdiv.id = "leechblocker";
      newdiv.style.width = "100%";
      newdiv.style.minHeight = "100%";
      newdiv.style.position = "fixed";
      newdiv.style.top = "0px";
      newdiv.style.left = "0px";
      newdiv.style.zIndex = 10000;
      newdiv.style.backgroundColor = "white";
      newdiv.style.display = "block";
      newdiv.style.overflow = "hidden";
      newdiv.style.textAlign = "center";
      newdiv.style.paddingTop = (window.innerHeight/2-10)+"px";
      newdiv.innerHTML = "Wait <span id='counter'>"+timeElapsed+"</span> seconds...";
      document.body.appendChild(newdiv);
   }

   function updateCounter()
   {
      var counter = document.getElementById("counter");
      timeElapsed--;
      counter.innerHTML = timeElapsed;
   }

   function unhide()
   {
      document.documentElement.style.overflow = "auto";
      var leechDiv = document.getElementById("leechblocker");
      leechDiv.parentNode.removeChild(leechDiv);
   }

   hide();
   window.setInterval(updateCounter,1000);
   window.setTimeout(unhide,timeout*1000);
}());
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜