title: Change target of a link based on what is currently displayed
body: <p>Again, I'm quite new to jQuery and there are still many things that seem simple yet get me stuck for hours.</p>
  
  <p>Right now, I'm trying to replace the target of a link. That I know how to do. But the thing is, the target has to change based on the div currently displayed.</p>
  
  <p>Here's the wireframe :</p>
  
  <p><img src="https://i.stack.imgur.com/YBIeY.jpg" alt="enter image description here"></p>
  
  <p>The link, of course, is on the arrow, which is fixed at the bottom of the viewport. You might have guessed by now, I'd like the link to point to #div2 when the visitor is on #div1, to #div3 when they are on #div2 and so on...</p>
  
  <p>I thought of a couple of ways to do this:</p>
  
  <p>1) Instead of a link to a div, the arrow could just trigger a scroll of X pixels. As all the divs must have the same height, that would work. Only, the user could at all times scroll themselves with their mouse instead of clicking the arrow. And if they do so, clicking the arrow afterwards would probably bring them in the middle of nowhere.</p>
  
  <p>2) I could replace the target of the link depending on which div is being hovered. But that would raise two other problems: the link wouldn't be replaced at all on mobile devices, and it just wouldn't be replaced either when the cursor is hovering the arrow itself, as it is fixed and above everything else.</p>
  
  <p>So, the ideal solution would actually replace the target of the link depending on the percentage of the divs being displayed: the link would have a target of #div3 if more than 50% of #div2 is being displayed.</p>
  
  <p>I think that would be the perfect solution.
  But I have absolutely no clue as to how to do this. ^^</p>
  
  <p>I would greatly appreciate any help. :-)</p>
  
  <p>Thanks in advance!</p>
  
  <p>edit: Actually, now that I think of it, the solution shouldn't replace the target of a link if more than 50% of a certain div is being shown. The divs have a height of 1100px, so if anyone with a screen definition lower than that (which is most people) goes on the site, it would cause problems.
  So the script should in fact replace the target of the link with #div3 if the visible height of #div2 is greater than that of #div3. I don't know if it makes the solution any easier to come up with. :-/</p>