Make Entire Div Clickable in this Scenario

Question

I am trying to make my website image gallery clickable when they hover over the images. I think the best way to achieve this is to make the div that contains the image a clickable link however I may be wrong. I want to be able to solve this problem with additional code that I can place in my additional css/javascript or html boxes.

I have tried targeting the certain portion of the code that I think contains the image in a div however no luck. Try looking in inspector in google chrome at: http://chandlersimon.com/home . The code below is the portion i tried targeting.

<div class="slide-bg" style="background-image:url(http://chandlersimon.com/wp-content/uploads/2017/01/Mockup-4.jpg)"></div>

Answer 1

You can accomplish this with HTML:

<a href="http://example.com">
  <div>
     anything
  </div>
</a>

or by using JQuery:

$(".myBox").click(function() {
  window.location = $(this).find("a").attr("href"); 
  return false;
});

<div class="myBox">
  blah blah blah.
  <a href="http://google.com">link</a>
</div>

Either way is perfectly valid. More info here .