link not working on android
===

I have a site that generates a background image that stretches and scrolls with the browser via jquery. The idea is for when the page loads the user just clicks anywhere on the image and it takes them into the site. 

I have an `<a>` tags around the body but there are a few issues:

*no prompting that it's a link by mouse on most browsers

*works on iPhone but won't even link at all on android.

What is the best, most cross-browser/mobile efficient way to achieve this?

    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<title>THE BROADHURST</title>
    	<meta charset="utf-8">
    	<meta name="keywords" content="" />
    	<meta name="description" content="" />
    	<link rel="stylesheet" href="/styles/css/thebroadhurst.css" type="text/css" media="screen" />
    	<link rel="stylesheet" href="/styles/css/jquery.vegas.css" type="text/css" media="screen" />
    
    	<script type="text/javascript" src="/jquery/jquery-1.7.2.min.js"></script>
    	<script type="text/javascript" src="/jquery/jquery.vegas.js"></script>
    	<script>
    	$( function() {
    	  $.vegas({
    	    src:'/styles/images/bh_rotate/bhR_<?php echo rand(1,31); ?>.png'
    	  });
    	});
    	</script>
    </head>
    <a href="/home.php">
    <body>
    	<div class="structure_main clearfix">
    	</div>
    </body>
    </a>

thank you in advance.