scrollen Sie zum nächsten div auf Knopf klicken

Question

Ich baue eine Website, die ein div in der rechten unteren Ecke hat. Dies ist immer sichtbar und schwebend, egal wie weit Sie nach oben oder unten scrollen. Sobald Sie darauf klicken, sollten Sie bis zum nächsten Div durchblättern. Die Website ist eine Seite mit langen Scrollseiten. Es gibt 5 Divs, die übereinander gestapelt sind. Wie kann ich das erreichen? Ich benutze JQuery und ScrollTop, um dies zu erreichen, aber es funktioniert nicht. Danke im Voraus.

Answer 1

Ich würde diesen Ansatz, indem jeden <div> eine ID zu geben, und die <div> in der rechten unteren Ecke machen enthalten ein <a> mit dem Standard href href='#<firstdiv>' zu sein. Von dort können Sie jede <div> ID in ein Array setzen und durch sie hindurchklicken. Also Ihr unten rechts div würde so aussehen

<div><a onclick="cycle(this);" href="#first_div"></a></div> 

Ihre individuelle <div> s, die Sie springen wie diese

<div id="first"></div> 
<div id="second"></div> 
<div id="third"></div> 

aussehen würde Und Ihre JS wäre dies

$(document).ready(function() { 
    var divs = ["first", "second", "third"]; 
    var counter = 0; 
}); 

function cycle(element) { 
    $(element).attr("href", divs[counter]); 
    if(counter < divs.length - 1) { 
     counter++; 
    } 
    else { 
     counter = 0; 
    } 
} 

Dies ist zwar nicht die einfachste Art, sich dem Problem zu nähern, dies sollte jedoch eine einigermaßen einfache Lösung bieten.