Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.11.2020, 16:20
Аспирант
Отправить личное сообщение для venom1996 Посмотреть профиль Найти все сообщения от venom1996
 
Регистрация: 10.11.2020
Сообщений: 69

скрол не по id
$(document).on("click", ".header-nav__dropdown li a", function(e) {
    var dropdownParent = $(this).closest(".header-nav__list>ul>li");
    if (dropdownParent.hasClass("isActive")) {
        var linkHref = $(this).attr("href");
        if (GetURLParameter(linkHref, "id")) {
            e.preventDefault();
            scrollToSection(GetURLParameter(linkHref, "id"));
            $(this).closest(".header-nav__dropdown").hide({
                duration: 100,
                complete: function complete() {
                    $(this).removeAttr("style");
                }
            });
        }
    }
});

есть такой код который скролит к нужному блоку по id, как его переделать что бы он скролил по #(якорь)
Ответить с цитированием
  #2 (permalink)  
Старый 19.11.2020, 17:13
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

venom1996,
информации недостаточно, но возможно так ...
$(document).on("click", ".header-nav__dropdown li a", function(e) {
    var dropdownParent = $(this).closest(".header-nav__list>ul>li");
    if (dropdownParent.hasClass("isActive")) {
        var hash = this.hash;
        if (hash) {
            e.preventDefault();
            scrollToSection(hash.slice(1));
            $(this).closest(".header-nav__dropdown").hide({
                duration: 100,
                complete: function complete() {
                    $(this).removeAttr("style");
                }
            });
        }
    }
});
Ответить с цитированием
  #3 (permalink)  
Старый 19.11.2020, 17:16
Аспирант
Отправить личное сообщение для venom1996 Посмотреть профиль Найти все сообщения от venom1996
 
Регистрация: 10.11.2020
Сообщений: 69

//Прокрутка до блока по id из get параметра в адресной строке
    var URL = window.location.href;
    if (GetURLParameter(URL, "id")) {
        setTimeout(function() {
            scrollToSection(GetURLParameter(URL, "id"), 0);
        }, 500);
    }

    //Прокрутка до блока при клике по выпадающему меню текущей страницы
    $(document).on("click", ".header-nav__dropdown li a", function(e) {
        var dropdownParent = $(this).closest(".header-nav__list>ul>li");
        if (dropdownParent.hasClass("isActive")) {
            var linkHref = $(this).attr("href");
            if (GetURLParameter(linkHref, "id")) {
                e.preventDefault();
                scrollToSection(GetURLParameter(linkHref, "id"));
                $(this).closest(".header-nav__dropdown").hide({
                    duration: 100,
                    complete: function complete() {
                        $(this).removeAttr("style");
                    }
                });
            }
        }
    });
    
    

    function scrollToSection(id) {
        var duration = arguments.length <= 1 || arguments[1] === undefined ? 800 : arguments[1];

        var delta = $(window).width() < 768 ? 0 : $(".header-nav").outerHeight();
        $("html,body").animate({
            scrollTop: $("#" + id).offset().top - delta
        }, duration);
    }


вот полный код, уже голову сломал, переделываю ссылки под якори, но скрол пропал
Ответить с цитированием
  #4 (permalink)  
Старый 19.11.2020, 17:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Сообщение от рони
возможно так ...
это сработало?
Ответить с цитированием
  #5 (permalink)  
Старый 19.11.2020, 17:30
Аспирант
Отправить личное сообщение для venom1996 Посмотреть профиль Найти все сообщения от venom1996
 
Регистрация: 10.11.2020
Сообщений: 69

нет к сожалению (
Ответить с цитированием
  #6 (permalink)  
Старый 19.11.2020, 20:12
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

Попробуйте так:

$(() => {
    const scrollTo = (target, duration = 800) => {
        if (!target) {
            return;
        }
        
        const delta = $(window).width() < 768 ? 0 : $('.header-nav').outerHeight();
        
        $('html,body').animate({
            scrollTop: $([target, `a[name="${target.replace(/^#+/g, '')}"]`].join(', ')).first().offset().top - delta
        }, duration);
    };

    if (location.hash) {
        scrollTo(location.hash);
    }
    
    $(document).on('click', '.header-nav__dropdown li a', function(e) {
        const $this = $(this);
        const hash = (this.href || '').split('#').pop();
        
        if ($this.closest('.header-nav__list > ul > li').hasClass('isActive') || !hash) {
            return;
        }
        
        e.preventDefault();
        
        scrollTo('#' + hash);
        
        $this.closest('.header-nav__dropdown').hide({
            duration: 100,
            complete: function () {
                this.removeAttribute('style');
            }
        });
    });
});

Последний раз редактировалось Nexus, 19.11.2020 в 21:33. Причина: See #post530953
Ответить с цитированием
  #7 (permalink)  
Старый 19.11.2020, 20:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Сообщение от Nexus
duration === undefined ? 800 : duration
?
почему условный оператор, а не строка 2 для назначения по умолчанию?
Ответить с цитированием
  #8 (permalink)  
Старый 19.11.2020, 20:33
Аспирант
Отправить личное сообщение для venom1996 Посмотреть профиль Найти все сообщения от venom1996
 
Регистрация: 10.11.2020
Сообщений: 69

без понятия, это делал не я, мне было бы проще сделать с нуля чем работать с готовым
Ответить с цитированием
  #9 (permalink)  
Старый 19.11.2020, 21:33
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

Сообщение от рони
почему условный оператор, а не строка 2 для назначения по умолчанию?
Хороший вопрос, на который у меня нет ответа

Спасибо, поправил.
p.s. код я не тестировал от слова «совсем».
Ответить с цитированием
  #10 (permalink)  
Старый 20.11.2020, 00:12
Аспирант
Отправить личное сообщение для venom1996 Посмотреть профиль Найти все сообщения от venom1996
 
Регистрация: 10.11.2020
Сообщений: 69

не работает к сожалению, как только не пытался, дело в том что там cms modx и перед ссылками стоит это условие
<li class="[[!If? &subject=`[[*id]]` &operator=`eq` &operand=`1` &then=`isActive` ]]">
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрол в IE11 Edge vade_js Internet Explorer 1 17.11.2016 13:49
Не отображается горизонтальный скрол javaphp Events/DOM/Window 4 03.01.2016 15:01
Как сделать скрол на высоту section (100%, 100px; etc)? Арсений JustPuk Events/DOM/Window 3 17.07.2015 21:32
Скрол в чате porezon Общие вопросы Javascript 2 23.03.2015 15:51
Помогите сделать скрол изображения Ivanishin Элементы интерфейса 12 01.02.2010 22:15