Плавная прокрутка к URL-адресу по событию клика с использованием функции

API royalslider имеет функцию rsSlideClick, которая может запускаться по событию.

Это выглядит так:

    var slider = $('#royalSliderStart').data('royalSlider');
    slider.ev.on('rsSlideClick', function() {

Дополнительная функция для использования плавной прокрутки якорных ссылок в списке выглядит следующим образом:

    $('ul.nav > a').bind('click',function(event){ 
              var $anchor = $(this); 
    $('html, body').stop().animate({ 
            scrollTop: $($anchor.attr('href')).offset().top 
            }, 1500); 
                event.preventDefault(); 
            }); 

Я ищу решения для использования функции плавной прокрутки с функцией rsSlideClick, желательно без ссылок на якорные ссылки.

В качестве примера решения пользователь нажимает на заданный слайд, и он плавно прокручивается вниз в другую область страницы (возможно, по идентификатору).

Решения?

Обновление 1:

HTML

<div class="container"> 
<ul class"nav"> 
<div class="royalSlider" id="royalSliderStart"> 
    <li class=”slide” target=”1”><slide #1></li> 
    <li class=”slide” target=”2”><slide #2></li> 
    <li class=”slide” target=”3”><slide #3></li> 
    <li class=”slide” target=”4”><slide #4></li> 
    <li class=”slide” target=”5”><slide #5></li> 
    <li class=”slide” target=”6”><slide #6></li> 
    <li class=”slide” target=”7”><slide #7></li> 
</div>
</ul> 
</div>

СЦЕНАРИЙ (НЕ РАБОТАЕТ ДОЛЖНЫМ ОБРАЗОМ. ТРЕБУЕТСЯ ПРОВЕРКА.)

var slider = $('#royalSliderStart').data('royalSlider');
    slider.ev.on('rsSlideClick', function() {
            $('.slide').on('click',function(event){ 
                var el = $(this); 
                $('html, body').stop().animate({ 
                    scrollTop: $(el.attr('target')).offset().top 
                }, 1500); 
                event.preventDefault(); 
        }); 
    }); 
});