Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как прокрутить страницу на 50px вверх после перехода по ссылке с якорем? (https://javascript.ru/forum/dom-window/81127-kak-prokrutit-stranicu-na-50px-vverkh-posle-perekhoda-po-ssylke-s-yakorem.html)

3emik 04.10.2020 17:06

Как прокрутить страницу на 50px вверх после перехода по ссылке с якорем?
 
Всем добрый день
Есть страничка сайта, там расположено 4 таба (с 2-3 вкладками каждый).
При переходе с других страниц по ссылке с якорем на странице с табами открывается нужная вкладка в нужном табе и прокручивается автоматически до нужного элемента (div с содержанием вкладки) страницы.
Но этот прокрутка осуществляется до верхнего края div'a, и соответственно верхняя часть окна браузера совпадает с верхней границей div'a. И получается что прокручиваются вкладки таба и заголовок.

Подскажите как правильно подправить скрипт, чтобы автоматически при переходе по ссылкам с якорями с других страниц, после загрузки нужной страницы и автоматической прокрутки к нужному табу происходила еще одна автоматическая прокрутка на 50px вверх?

Использую такой код:
(function($) {
$(function() {

$('ul.tabs').delegate('li:not(.current)', 'click', function() {
$(this).addClass('current').siblings().removeClass ('current')
.parents('div.tabs-content').eq(0).find('>div.box').hide().eq($(this) .index()).fadeIn(500).show();
})

var tabIndex = window.location.hash.replace('#tab','')-1;
if (tabIndex != -1) $('ul.tabs li').eq(tabIndex).click();

$('a[href*=#tab]').click(function() {
var tabIndex = $(this).attr('href').replace(/(.*)#tab/, '')-1;
$('ul.tabs li').eq(tabIndex).click();
});
})
})(jQuery)

Заранее всем благодарен

3emik 04.10.2020 21:26

Решено добавлением кода
$('html,body').animate({ scrollTop: $(this).offset().top - 100 }, 500);
7й строкой


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