Проблема с jquery scrollTop function

Question

Я пытаюсь следовать принципу DRY, меняя кучу повторяющихся функций, но я застрял здесь. Я хочу изменить этот свиток функцию, которая повторяется 4 раза с различными классами и идентификаторов к более общему способу (я использую JQuery):

$('.empresa').click(function(event){ 
    $('html, body').animate({ 
     scrollTop: $("#empresa").offset().top 
    }, 500); 
    return false; 
    }); 
    $('.nosotros').click(function(event){ 
    $('html, body').animate({ 
     scrollTop: $("#nosotros").offset().top 
    }, 500); 
    return false; 
    }); 

классов являются элементами навигации в пределах ul, которая выглядит примерно так.

<ul class="nav"> 
    <li><a href="index#nosotros" class="nosotros">Link to the anchor</a></li> 
    <li><a href="index#empresa" class="empresa">Link to the anchor</a></li> 
</ul> 

и проспект к тегам - это элементы div с этими тегами.

<div class="some-random-class" id="empresa" name="empresa"> 
<div class="some-random-class" id="nosotros" name="nosotros"> 

Я использовал этот новый селектор, чтобы захватить класс списка с правильным якорем, но у меня возникают проблемы с прокруткой частью функции, я не знаю, чтобы использовать/конвертировать класс или имя объекта, извлеченного в id, поэтому я могу продолжать использовать его так же, как и раньше.

$('.nav li').children('a').click(function() { 
    alert($(this).attr('class')); 
}); 

надеюсь, что вы, ребята, можете мне помочь!

Answer 1

$('.nav > li > a').click(function(e){ 
    e.preventDefault(); 
    $('html,body').animate({ 
     scrollTop: $('#'+$(this).prop('class')).offset().top 
    }); 
}); 

Answer 2

Вы также можете использовать:

$('.fluidJump').on('click', function(event) { 
    event.preventDefault(); 
    var offset = $($(this).attr('href')).offset().top; 
    $('html, body').animate({scrollTop:offset}, 500); 
}); 

класса Add "fluidJump" на текстовой ссылке, чтобы перейти к этому разделу с анимацией. (числовое значение)

<a href="#sectionid">Go to section</a>