Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как убрать scroll по якорю, используя метод offset ? (https://javascript.ru/forum/dom-window/85263-kak-ubrat-scroll-po-yakoryu-ispolzuya-metod-offset.html)

WebMachine 31.05.2023 19:41

Как убрать scroll по якорю, используя метод offset ?
 
Здравствуйте.

Я использую скрипт, с якорным свойством, который позволяет использовать несколько тел bootstrap вкладок вместо одной, на одной кнопке.

И столкнулся с проблемой.
Как убрать возвращение на предыдущее место, при нажатии на якорную ссылку?

Нужно чтобы при нажатии на якорную ссылку изменялось отображение bootstrap тел, но при этом текущая позиция оставалась неизменной (где нажал там и остался!).

Я так понимаю тут надо поиграть с методом offset. Но не уверен

Текущий скрипт:
// передаём тело табов через свойство data-bs-toggle
$('#mainservice a[data-bs-toggle="tab"]').on('show.bs.tab', function(e) {
    let target = $(e.target).data('bs-target')
    $(target)
    .addClass('active show')
    .siblings('.tab-pane.active')
    .removeClass('active show');
    // return false; - не подходит! так как позиция остаётся, но соседние функции перестают корректно работать
    // e.preventDefault(); - не подходит! так как позиция остаётся, но соседние функции перестают корректно работать
});

voraa 31.05.2023 20:36

Цитата:

Сообщение от WebMachine
Как убрать возвращение на предыдущее место, при нажатии на якорную ссылку?

Надо, что бы при клике на ссылку не было перехода. Т.е. обрабатывать клик самому. В нем
ev.preventDefault()
и скроллинг к нужному месту.
Или не скроллинг, а показ нужной части страницы.

WebMachine 31.05.2023 21:11

Цитата:

Сообщение от voraa (Сообщение 552206)
Надо, что бы при клике на ссылку не было перехода. Т.е. обрабатывать клик самому. В нем
ev.preventDefault()
и скроллинг к нужному месту.
Или не скроллинг, а показ нужной части страницы.

да. но как?

повторюсь, если использовать e.preventDefault(); то позиция остаётся, но соседние функции перестают корректно работать.

Надо запретить не все возможности якоря а только изменение позиции.

В моём представлении данная картина основана на методах: offset или scroll-behavior

Но как составить такое решение ума не приложу

voraa 31.05.2023 22:19

Цитата:

Сообщение от WebMachine
повторюсь, если использовать e.preventDefault(); то позиция остаётся, но соседние функции перестают корректно работать.

Ничего не могу посоветовать не видя эти "соседние" функции
Цитата:

Сообщение от WebMachine
Надо запретить не все возможности якоря а только изменение позиции.

Якорь - это ссылка. При клике по ней выполняются действие по умолчанию - переход к якорю (по новому url с этим якорем) и запоминание в истории. Это можно отменить только с помощью preventDefault()
Подумайте, может вместо ссылки с якорем стоит использовать кнопку.
Ведь по семантике ссылка - что бы куда то перейти, кнопка - что бы что то сделать (показать другую вкладку)

WebMachine 31.05.2023 22:53



Удалось решить задачу, с помощью history.pushState. Он также задаёт и сохраняет ссылку но без подкидывания


Часовой пояс GMT +3, время: 08:15.