wywołany anchor z określonym marginesem górnym, jak?

[Qbik]

jak ustawić żeby po kliknięciu na link wynik wyświetlał się z określonym marginesem?

o co dokładnie mi chodzi widać tutaj

http://rog.jjmanufaktura.pl/specjalizacje/badania-prenatalne

jak kliknę cokolwiek z menu po lewej przenosi mnie na daną pozycję ale wyświetla ją na samej górze strony a chciałbym żeby była pod menu czyli z określonym margnesem od góry, da się to jakoś zrobić??

[Tor_]

Może tak .Anchor na konkretne słowo w artykule .A w menu powiedzmy moduł własny html tworzysz link do tego artykułu plus opcje nazwy anchora do którego ma link przenieść .W edytorze jce to kwestia paru kliknięć . Lub zastosowac szablon "one - page"

[Qbik]

Bo to jest strona One page ;)
ogólnie skorzystałem z pluginu Article Auto TOC (http://extensions.joomla.org/extensions/news-display/article-elements/articles-toc/11573) i działa ok tworzy menu dla określonych nagłówków h4

To czego nie udało mi się zrobić, to jak kliknę na jakąś pozycję w menu np USG to ukrywa ją pod górnym menu, a chciałbym żeby pokazywała się poniżej :(

znalazłem taki skrypt,

function scrollToAnchor() { if($(".jquery-anchor").length > 0 && document.URL.indexOf("#") >= 0){
var anchor = document.URL.split("#")[1];
$(".jquery-anchor").each(function() {
if($(this).attr("name") == anchor) {
$("html,body").animate({
scrollTop: $(this).offset().top - 130},
'slow');
}
});
}
}ale nie moge go odpalić niestety nie jestem mocny w JS więc jakby ktoś mógł zerknąć będę wdzięczny. Chyba że da się to zrobić za pomcą css.

[Karol99]

Kiedyś zrobiłem taki efekt dodając odpowiednie id-y kotwic do elementów ukrytych. Po kliknięciu strona przewijała się tak, że kotwica lądowała na górze ekranu, ale odpowiednia (wyświetlana) treść ustawiała się z odpowiednim odstępem niżej.

[Qbik]

Ok tylko to dałoby rade zrobic dla np desktopowej wersji, przy responsywnosci cieżko bedzie to odpowiednio ustawic :/

[Qbik]

ok obszedłem to takim sposobem

article .toc {
border-top: 75px solid transparent;
margin-top: -75px;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}

zaczerpnięte z http://nicolasgallagher.com/jump-links-and-viewport-positioning/demo/#method-D