Sorry, I know the name sounds like a poor attempt at some black hat SEO, but that’s not the case (I just can’t think of a better name for it.) Remember my hidden message CSS trick? This is a jQuery trick in the same theme. With this, you can hide links within links, so by default they go to any normal page, but contain a hidden link on double click – taking your in the know visitors to a secret page.

It’s all very easy to set up. First, create your normal link.

<a href="http://www.google.com">Google.com</a>

Then we’re going to give it an ID for our jQuery code.

<a id="hiddenLink" href="http://www.google.com">Google.com</a>

We’re going to use jQuery’s click and dblclick events for this. So first we’ll go ahead and set up the single click event first.

$("a#hiddenLink").click(function(){
  var timeout = setTimeout(function() {
    location.href=$("a#hiddenLink").attr("href");
  }, 500);
  return false;
});

As you can see, we have to set up a single click event to delay your browser from immediately visiting the href link. We’re only delaying it by half a second, not enough time to notice a delay but just enough time to get that double click in.

So now we’ll set up the double click event, which will contain the URL to your secret page.

$("a#hiddenLink").dblclick(function(){
  location.href="http://wikipedia.org";
});

And that’s it! Click here for a demo (or double click for some fun.)