Lassen Sie mich mehrere Situationen des Kontrollpunkts zusammenfassen:
1. Auf der gleichen Seitenoberfläche
<A name = add> </a> <!-definieren
2. In verschiedenen Seiten ist der Ankerpunkt in A.HTML und der Sprungsprung vom Link einer anderen Seite zu diesem Ankerpunkt positioniert
<A href = a.html#add> springen zu A.Add </a>
3. Klicken Sie auf den Link, um das JS -Ereignis auszulösen und gleichzeitig zum Ankerpunkt zu springen.
Der erste Typ:
<A href =#add OncLight = add ()> Auslösen der Funktion hinzufügen und zum Ankerpunkt hinzufügen </a>
Der zweite Typ:
<div id = divnode> <!-Inhalt-> </div> <! Falsch;> Erkennen Sie den Ankerpunkteffekt durch Scrolliintoview </a>
Es gibt verschiedene Methoden zur Positionierung der Ankerpositionierung in HTML.
1. Verwenden Sie die ID -Positionierung:
<A href =#1f name = 1f> verankerungspunkt 1 </a> <div name = 1f> <p> 111111111111 </br> 111111111111 </br> 1111111111 </br> 1111111111111111111111111111111 </br> > </p> </div>
Eine solche Positionierung kann für jedes Etikett lokalisiert werden.
2. Verwenden Sie die Namenspositionierung:
<A href =#5f> Anchor Point 5 </a> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> "
Die Verwendung des Namensattributs kann nur für das A -Tag gefunden werden, und andere Tags wie Div können nicht positioniert werden.
3. Verwenden Sie JS -Positionierung
<li class = onclick = javaScript: document.getElementById ('Here').Beispiel:
Js Ankerpunkt Smooth -Positionierung
<! {Schriftart: 16px; } Div.Test P {Höhe: 400px; ) 0: v;} //? Kopf) var wb = e.offsetwidth; + (E.currentStyle? Intval (E. Currenstyle). E.Currensttyle.BordRtopwidth): 0); var, w, h; if (document.documentEdElement &&& documentElement scrolltop; , Dauer) {if (typeof el! = 'Object') = GetCroll (); ) {var t = (neues Datum) .Getime (); {Z.Scroll (ZPY, ZPX)}, 13); (-Math.cos (p * math.pi) / 2) + 0,5) * (ZPX -ZSL) + ZSL; Fenster .Scrollto (l, t)}; > <a name = header_1 id = header_1> </a> <stark aufclick = javaScript: scroller ('header_4', 800);> header_1-> header_4 </p> </p> </div> </div> </div> div class = test> <a name = header_2 id = header_2> </a> <stark aufclick = javascript: scroller ('header_5', 800);> header_2-> header_5 </strong>> </p > </div> <div class = test> <a name = header_3 id = header_3> </a> <starken Onclick = JavaScript: Scroller ('Header_6', 800); class = test> <a name = header_4 id = header_4> </a> <stark aufclick = javaScript: scroller ('header_7', 800);> header_4-> header _7 <</strong> <p> </p> </div> <div class = test> <a name = header_5 id = header_5> </a> <Strong Knowledge = JavaScript: Scroller ('Header_3', 800); /p> </div> <div class = test> <a name = header_6 id = header_6> </a> <star > <p> </p> </div> <div class = test> <a name = header_7 id = header_7> </a> <stark aufclick = javaScript: scroller ('header_1', 800);> header_7-> Header_1 </strong> <p> </p> </body> </html>Das oben genannte ist der Inhalt dieses Artikels.