title: Hover over a hidden element to show it
body: <p>Is there any way to hover over an element that's already hidden. I am trying to mimic what Steam does with their arrow navigation on their home page. You'll notice that when you first get to the page, there are no arrows showing:</p>
  
  <p><img src="https://i.stack.imgur.com/Ef2g3.jpg" alt="enter image description here"></p>
  
  <p>Then when you hover over the area where there should be an arrow, it shows itself:</p>
  
  <p><img src="https://i.stack.imgur.com/Rki5b.jpg" alt="enter image description here"></p>
  
  <p>I've tried setting my divs that contain the arrow images to <code>display: none</code> and have also tried <code>visibility: hidden</code> but neither seems to work with the hover or mouseover methods in jQuery. I would have thought <code>visibility: hidden</code> would make it work, but that doesn't seem to be the case. Is there any other way I can hide these divs from the start but still be able to have hover events work on them?</p>