Якорные ссылки прокручиваются до нужного раздела, а затем немедленно перезагружают страницу.Php

Кемеровские программисты php общаются здесь
Ответить Пред. темаСлед. тема
Anonymous
 Якорные ссылки прокручиваются до нужного раздела, а затем немедленно перезагружают страницу.

Сообщение Anonymous »

Я потратил часы, пытаясь решить эту проблему, и рассмотрел множество подобных вопросов по SO. Я пробовал различные предложенные решения, но ни одно из них не работает. Вот в чем проблема:
У меня есть страница с якорными ссылками в главном меню. Ссылки перенаправляют пользователя на новую страницу, а затем прокручивают до нужного положения. Однако когда пользователь находится на странице, содержащей привязанные разделы, и нажимает ссылки, он прокручивается до нужного раздела, но затем страница перезагружается, и пользователь возвращается к началу страницы.
Это код пунктов меню:

Код: Выделить всё

[url=https://swamprabbitmedia.com/Sandbox/EasyReads/target-audience/]Target Audience[i][/i][/url]

[list]
[*][url=https://swamprabbitmedia.com/Sandbox/EasyReads/target-audience/#adultReaders]Adult Readers[/url]
[*][url=https://swamprabbitmedia.com/Sandbox/EasyReads/target-audience/#YAReaders]Young Adult Readers[/url]
[*][url=https://swamprabbitmedia.com/Sandbox/EasyReads/target-audience/#childReaders]Children’s Books[/url]
[/list]
А это код одного из привязанных разделов (все они настроены одинаково с соответствующими идентификаторами:

Код: Выделить всё

                





[i]




[url=https://swamprabbitmedia.com/Sandbox/EasyReads/young-adult-hi-lo-books/]


[/i]             
Explore Adult Titles

[/url]









Easy Read Books For Adult Readers



Adults who struggle with literacy can use My Easy Read Books to enhance their reading skills without feeling overwhelmed. These books are ideal for:
[list][*][b]Multi-lingual Learners:[/b] Individuals learning English as a second language benefit from simplified vocabulary and engaging stories that build confidence in reading comprehension.[*][b]Reluctant Readers:[/b] Adults who have avoided reading due to difficulty or lack of interest can find topics that resonate with them, fostering a renewed enthusiasm for books.[*][b]Adult Education Programs:[/b] Educators in literacy initiatives use these books to provide accessible material that supports skill-building and lifelong learning.[/list]





Я пробовал использовать относительные ссылки на рассматриваемой странице (например, #adultReaders), а не полный URL-адрес. Я попробовал использовать следующий код JavaScript:

Код: Выделить всё

document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();

document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});
Кажется, ничего не работает.
Я должен отметить, что у меня есть другой набор кнопок на той же странице, которые ссылаются на те же привязанные разделы, используя относительные URL-адреса (например, #adultReaders). Эти ссылки работают должным образом. Проблему вызывают только те элементы, которые находятся в основном меню навигации.
Если вы хотите изучить поведение, вы можете посетить страницу @ https://swamprabbitmedia.com/Sandbox/EasyReads. /целевая аудитория/. Ссылки, о которых идет речь, расположены в главном меню навигации в разделе «Целевая аудитория».
Будем очень благодарны за любую помощь.

Подробнее здесь: https://stackoverflow.com/questions/792 ... ading-page
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «Php»