Fullscreen link with jQuery or JavaScript

Question

I have a responsive index page with only a background-image as content. When you click, wherever in the page, there must be a link to the homepage.

Second, it would be nice also that instead of a simple pointer, the visitor sees a link icon (don't know what the 'hand' is called) over the whole page, so he immediately knows that everything on the whole page is clickable.

Searched a lot over the internet, perhaps my question is too simple, cannot find an answer anywhere, not even in tutorials.

Here is what I already figured out with what I know. It's incomplete and surely the third line is not correct, I don't know the syntax.

<script type="text/javascript"> 
$("body").on("click", function(){
    $(this).a href 'home.html'();
});
</script>

Thank you!

Answer 1

to go to a specific url do window.location.href in your .click() function

to make the cursor a hand do cursor: pointer; in your css

$(document).ready(function() {
  $('body').on('click', function() {
    window.location.href = "http://www.google.com";
  });
});

html, body {
  height: 100%;
}
.body {
  height: 100%;
  background-color: lightgray;
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="body">
</div>