macik_spb
@macik_spb
Ф-ф-фрилансер :))

Html. Как заставить браузер делать отступ от верхней границы при переходе по якорным ссылкам?

Дано:

— есть страница (xhtml) с табличными данными.

— в таблице сделан «липкий» заголовок (при прокрутке страницы заголовок таблицы прилипает к верхнему краю и остается там). Примерно как в результатах поиска Яндекса.

— в таблице есть якорные ссылки.


Проблема:

при переходе по якорной ссылке браузер позиционирует страницу таким образом, что якорь, на который мы перешли, оказывается в самом верху страницы и попадает под «липкий» заголовок. Т.е. искомую строку данных не видно — ее перекрывает заголовок.


Задача:

сделать переход по якорю с отступом на высоту заголовка.


Может уже кто решал такую задачу?


Пока пришли в голову такие варианты:

1. сместить якорь на 1-2 строки ниже, но это нарушит логику, к тому же строки могут быть разной высоты.

2. писать скрипт, который при клике отматывает страницу на заданное смещение, но тут надо смещение вычислять как-то динамически.

3. вешать на клик обработчик с задержкой, который после перехода на якорь отматывает страницу на высоту заголовка.
  • Вопрос задан
  • 16855 просмотров
Пригласить эксперта
Ответы на вопрос 4
@Softlink
Могу предложить такой вариант. На один элемент больше, но без скриптов.
Ответ написан
UseRifle
@UseRifle
не проверял, но попробуйте задать элементу отрицательный margin-top и в равной величине положительный padding-top
Ответ написан
crackedmind
@crackedmind
web-developer
А вы не пробовали jquery.scrollTo? (http://archive.plugins.jquery.com/project/ScrollTo)
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Amigoweb Магнитогорск
от 30 000 до 40 000 руб.
EducaGroup Санкт-Петербург
от 90 000 руб.
Kernel Web Новосибирск
от 80 000 руб.