Making Entire background-image clickable

Question

I am fixing up a friends website, and he has an advertisement that takes up the entire background (body). Currently, the background image is set using CSS (background-image):

body {
background-attachment:scroll;
background-color:#000000;
background-image:url("http://gunshyassassin.com/wp-content/uploads/2010/10/gunshy_takeover2OUTNOW4.jpg");
background-position:center top;
background-repeat:repeat-x;

I would like the make the entire background image clickable (a link). You can see the site here: http://gunshyassassin.com

What is the best way to go about this? Seems so easy, but after a days work, I am blanking! It is important that the main content area will not be affected (eg we cannot set the entire body to be a link or else all of its children will also be clickable, which is a no-no) I just need the body background image to be a link!

Answer 1

Make the part that should not be part of the ad have this style:

position: relative;left:0;top:0;z-index:1`

Make link to the other site like this:

<a style="display:block;position:fixed;left:0;top:0;width:100%;height:100%;cursor:pointer" href="http://adsite.com"&gt;&lt;/a&gt;

Answer 2

Well... in ''theory''... you would just have a div (which either has the image as a background image, or as an <img> within it) at 100% width and height, positioned absolutely behind the content, and then add an event listener to that div. But I really would advise against making your whole background an ad - it's annoying and obtrusive.