CODEWITHSUNDEEP
javascriptjqueryhtmlcss
BrianV
BrianV

Reputation: 9

Link href to the next div with anchorpoint

I want to link to the next div with an anchor point.

Currently i have an a href that directs the user to the second div (#div2) via an anchor point, like this:

<a href="#div2">Arrow down</a>

How do i make this arrow link to the following div?

So if the user is focused on the #div2 i want it to link to #div3, when it's on #div3 i want it to link to #div4, etc.

Bonus goal: when the last div is reached (let's say #footer) i want it to point back up to #div1

EDIT: Thanks for the answers, i have made a JSfiddle to make it more clear: https://jsfiddle.net/dj5p82bg/

Upvotes: 0

Views: 473

Answers (1)

I wrestled a bear once.
I wrestled a bear once.

Reputation: 23379

Here ya go Brian

$(".linkdiv").each(function(index){
    $(this).attr("id", "linkdiv"+index);
    var text = index === $(".linkdiv").length -1 ? "first" : "next";
  var next = index === $(".linkdiv").length -1 ? 0 : index+1;
  $("<a href='#linkdiv"+next+"'>Go to "+text+"</a>").insertBefore(this);
});

Here's the fiddle

Upvotes: 1

Related Questions