Позвольте мне подвести итоги несколько ситуаций контрольной точки:
1. на той же странице поверхности
<A name = add> </a> <!-Определите точку якоря-> <a href =#Добавить> прыгнуть, чтобы добавить </a>
2. На разных страницах точка привязки расположена в A.HTML, и прыжок прыжок от ссылки другой страницы на эту якорную точку
<A href = a.html#добавить> прыгать в A.Add </a>
3. Нажмите на ссылку, чтобы запустить событие JS и одновременно перейти к точке якоря.
Первый тип:
<A href =#add onclight = add ()> запустить функцию добавления и перейти к точке Add Anchor </a>
Второй тип:
<div id = divnode> <!-Содержание-> </div> <!-Узел, который нужно прыгнуть-> <a href =# onclick = document.getelemetnbyid ('divnode') false;> реализовать эффект точки привязки через Scrolliintoview </a>Существует несколько методов, чтобы установить позицию якоря в HTML.
1. Используйте позиционирование идентификатора:
<A href =#1f name = 1f> Якорная точка 1 </a> <div name = 1f> <p> 11111111111 </br> 1111111111111 </br> 111111111111111111111111111111111 </br > </p> </div>
Такое позиционирование может быть расположено для любого ярлыка.
2. Используйте позиционирование имени:
<A href =#5f> Якорь -точка 5 </a> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> "
Использование атрибута имени может быть расположен только для тега A, и другие теги, такие как Div, не могут быть расположены.
3. Используйте позиционирование JS
<li class = onclick = javascript: document.getElementbyId ('здесь').Пример:
Якоря JS плавное позиционирование
<! {Font-Size: 16px; } Div.test p {hight: 400px; )? голова); + (E.currentStyle? Intval (E.currenStyle.BordrtopWidth): 0); E.currensttyle.bordrtopwidth): 0); var, w, h; Scrolltop; Duration) {if (typeof el! = 'Object') {el = документ = GetScroll (); ) {var t = (новая дата) .getTime (); {z.scroll (zpy, zpx)}, 13); (-Math.cos (p * math.pi) / 2) + 0,5) * (zpx -zsl) + zsl; Window .scrollto (l, t)}; > <a name = header_1 id = header_1> </a> <strong onclick = 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> <strong onclick = javascript: scroller ('header_5', 800);> header_2-> header_5 </strong >> </p > </div> <div class = test> <a name = header_3 id = header_3> </a> <strong onclick = javascript: scroller ('header_6', 800); class = test> <a name = header_4 id = header_4> </a> <strong onclick = 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 знание = javascript: scroller ('header_3', 800); /p> </div> <div class = test> <a name = header_6 id = header_6> </a> <strong onclick = javascript: scroller ('header_2', 800);> header_6-> header_2 </strong > <p> </p> </div> <div class = test> <a name = header_7 id = header_7> </a> <strong onclick = javascript: scroller ('header_1', 800);> Header_7-> Header_1 </strong> <p> </p> </body> </html>Приведенное выше содержимое этой статьи.