Iniciante em Jquery, porém utilizei este script que encontrei para dar o efeito de suavização no scroll até o link "ancorado":
$(document).ready(function () {
function filterPath(string) {
return string
.replace(/^\//, '')
.replace(/(index|default).[a-zA-Z]{3,4}$/, '')
.replace(/\/$/, '');
}
$('a[href*=#]').each(function () {
if (filterPath(location.pathname) == filterPath(this.pathname)
&& location.hostname == this.hostname
&& this.hash.replace(/#/, '')) {
var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) + ']');
var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false;
if ($target) {
var targetOffset = $target.offset().top;
$(this).click(function () {
if($(window).width() > 760){
$('html, body').animate({scrollTop: targetOffset}, 250);
return false;
}
});
}
}
});
});
HTML
<nav id="menu">
<ul>
<div class="marcadagua"> <a href="#"> <img src="logo_menu.png"> </a></div>
<li><a href="#qs">Quem somos</a></li>
<li><a href="#parceiros">Parceiros</a></li>
</ul>
</nav>
--
<div class="divancora"> <a name="qs"></a> </div>
<div class="divancora"> <a name="parceiros"></a> </div>
Ocorre que ele de algum modo ele não leva ao exato ponto destinado. Dá sempre uma diferença de altura até o ponto que deveria ir. Não é uma diferença fixa.
Queria saber a razão disso.