Background image with link

Hello. i am trying to put a link into my background image. I opened default.php in layouts folder and i put this code in

Code: Select all

<a id="skin" class="skin" target="_blank" href="http://gr.playstation.com/ps4/" style="background-image: url(http://localhost/unboxholics/images/00003.jpg); background-attachment: scroll; background-origin: padding-box; background-position: 50% 0px; background-repeat: no-repeat no-repeat;"></a>

Then i put this code in override.css

Code: Select all

a#skin.skin{
   background-image:    background-image: url(../images/00003.jpg);

background-attachment: scroll;
background-origin: padding-box;
background-position: 50% 0px;
background-repeat: no-repeat no-repeat;}

a#skin {
display: block;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;}

The image appeared and the link worked fine but it created another problem. The image is on top of other module positions and that causes some content not to appear or not working as they supposed to work.

I tried to put the first code between other module positions ( after gkmenuwrapper or after gkPage) but it causes similar problems. Do you have any clue what it needs to work? Thanks in advance.

There is no easy way to put huge link in the background, probably it is better to use JavaScript to link some existing container (like BODY) to link it to desired URL.