Deprecated: Function get_magic_quotes_gpc() is deprecated in /home/styllloz/public_html/qa-include/qa-base.php on line 1175

Warning: session_start(): Cannot start session when headers already sent in /home/styllloz/public_html/qa-include/app/users.php on line 162

Warning: Cannot modify header information - headers already sent by (output started at /home/styllloz/public_html/qa-include/qa-base.php:1175) in /home/styllloz/public_html/qa-include/app/users.php on line 1267

Warning: Cannot modify header information - headers already sent by (output started at /home/styllloz/public_html/qa-include/qa-base.php:1175) in /home/styllloz/public_html/qa-include/app/page.php on line 356
Html. How to force the browser to do the offset from the top border when you click on anchor links? - code-flow.club | Q&A

Html. How to force the browser to do the offset from the top border when you click on anchor links?


Warning: count(): Parameter must be an array or an object that implements Countable in /home/styllloz/public_html/qa-theme/donut-theme/qa-donut-layer.php on line 274
0 like 0 dislike
53 views
This:

— there is a page (xhtml) with tabular data.

— the table is made "sticky" header (when scrolling the page, the table header sticks to the top and stays there). Like in Yandex search results.

— the table has anchor links.


Problem:

when you click on the anchor link, the browser positions the page so that the anchor to which we went, is at the top of the page and falls under the "sticky" header. I.e. search string data is not visible — it covers the header.


Task:

to make the transition on the anchor with a space at the height of the header.


Who can already solved such problem?


Until came up with the following options:

1. to shift the anchor 1-2 line below, but this will break the logic to the same row can be different heights.

2. to write a script that when clicked takes the page at the specified offset, but here it is necessary to calculate the offset somehow dynamically.

3. hang on-click handler with a delay, after which the transition is anchored by unrolling a page at the height of the header.
by | 53 views

4 Answers

0 like 0 dislike
Can offer this option. One item more, but without scripts.
by
0 like 0 dislike
not tested, but try to set the element a negative margin-top equal magnitude positive padding-top
by
0 like 0 dislike
Have you tried jquery.scrollTo? (http://archive.plugins.jquery.com/project/ScrollTo)
by
0 like 0 dislike
by

Related questions

0 like 0 dislike
3 answers
0 like 0 dislike
1 answer
asked Apr 11, 2019 by maiskiykot
0 like 0 dislike
2 answers
0 like 0 dislike
1 answer
asked Mar 24, 2019 by AlexFadeev
0 like 0 dislike
1 answer
110,608 questions
257,186 answers
0 comments
35,181 users