Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Не получается сделать прокрутку к якорям (https://javascript.ru/forum/dom-window/73949-ne-poluchaetsya-sdelat-prokrutku-k-yakoryam.html)

madeas 31.05.2018 10:01

Igorsrt,
а вы не пробовали использовать альтернативные варианты? вроде того, что я кинул выше. можно сделать плавную прокрутку от любой ссылки к своему якорю https://jsfiddle.net/fweycbt1/4/
Я в js не силен, но в большинстве случаем стараюсь решать задачи без скриптов. Ведь если напихать много и не аккуратно, они начинают конфликтовать. Возможно, из-за этого и не работает ваш слайдер.

j0hnik 31.05.2018 10:24

<style>
button{
	margin-bottom: 500px;
}
</style>
   <button id="but">скролл</button>
   <div id="div">Блок</div>
<script>
   but.onclick =e=> div.scrollIntoView({behavior: 'smooth' });
</script>


можно проще

madeas 31.05.2018 10:34

j0hnik,
разве? это же надо для каждой кнопки прописывать, а если якорь в футере, то все поедет https://jsfiddle.net/fweycbt1/5/

j0hnik 31.05.2018 10:43

madeas,
ничего, подучитесь, начнете разбираться. ;)

Igorsrt 31.05.2018 14:33

так у меня ничего и не получилось толком... из кнопок в слайдере прокрутка не работает почему-то, если в ссылке указать не просто #анкор, а страница#анкор - то тоже не крутится ((

Nexus 31.05.2018 14:45

Igorsrt,
https://jsfiddle.net/fweycbt1/6/

Igorsrt 31.05.2018 15:14

Мне, если честно вполне вот этот вариант устроил бы (т.е. при помощи добавления класса к нужным ссылкам):
$('a.nav').click(function() {
        $("html, body").animate({
            scrollTop: $($(this).attr('href')).offset().top + "px"
        }, {
            duration: 500
        });
        return false;
    });

но почему он не срабатывает на ссылках в слайдере, я же там класс nav тоже добавляю?... второй день голову ломаю

Nexus 31.05.2018 15:19

Igorsrt,
$('a.nav').click(function(e) {
    e.preventDefault();

    $("html, body").animate({
        scrollTop: $('#' + $(this).attr('href').split('#').pop()).offset().top + "px"
    }, {
        duration: 500
    });
});


Цитата:

Сообщение от Igorsrt
но почему он не срабатывает на ссылках в слайдере, я же там класс nav тоже добавляю

Возможно слайдер убивает всплытие события.
Как вариант, можете попробовать слайдер инициировать после этого скрипта.

рони 31.05.2018 15:19

Цитата:

Сообщение от Igorsrt
но почему он не срабатывает на ссылках в слайдере, я же там класс nav тоже добавляю?...

не смотрел, но обычно стрелки вперёд/назад перекрывают слайд, и кликнуть нельзя, либо все клики по слайду отменены, чтоб можно было его "таскать"

Igorsrt 31.05.2018 20:25

Цитата:

Сообщение от рони (Сообщение 486412)
не смотрел, но обычно стрелки вперёд/назад перекрывают слайд, и кликнуть нельзя, либо все клики по слайду отменены, чтоб можно было его "таскать"

Кликнуть-то я могу по ссылке и будет переход на якорь... только без прокрутки почему-то


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