锚点定位并距离顶部一定偏移

问题:页面中使用锚点定位跳转时,通常使用href="#id"来实现,但这种方法会导致url改变,页面刷新时可能会出现问题,而且会直接定位到页面顶部,如果有固定的导航栏,会挡住目标内容

解决方法:使用scrollTop实现锚点定位

HTML:

个人信息
 
要跳转的div

JS:

function topMao(target){
    $('html, body').animate({scrollTop: $(target).offset().top - 130}, 500);//130为锚点到距顶部的距离,500为执行时间
    return false;
}

 

你可能感兴趣的:(锚点定位并距离顶部一定偏移)