Слайдер внизу баннера
 

Доброго времени суток!
На сайте существует баннер и внизу баннера отображается панель навигации (скрин "Слайдер внизу баннера")
При смене баннера подсвечивается соответствующий пункт внизу.
На данный момент, если добавить много пунктов, то названия выходят за области и расстояние между пунктами становится минимальное (т.е. текст становится нечитаемым).
Хотелось бы сделать так, чтобы при большом количестве пунктов слайдер прокручивался влево и вправо.
Подскажите, пожалуйста, каким образом возможно сделать? Спасибо.

На данный момент навигация строится следующим образом:

jQuery(document).ready(function(){
      jQuery('.main_slider .slider li').css('display','block');
      main_slider = jQuery('.main_slider .slider').bxSlider({
pager:false,
controls:false,
pause:6000,
 mode:'fade',
		  <?if(count($arResult["ITEMS"])>1):?>
 auto:true,
<?endif;?>
          onSlideAfter: function ($slideElement, oldIndex, newIndex) {
              jQuery('.slider_pager li').removeClass('active');
              if (jQuery('.slider_pager .pages').eq(0).find('li').eq(newIndex).length) {
                  jQuery('.slider_pager .pages').eq(0).find('li').eq(newIndex).addClass('active');
              } else {
                  jQuery('.slider_pager .pages').eq(1).find('li').eq(newIndex-jQuery('.slider_pager .pages').eq(0).find('li').length).addClass('active');
              }
          }
      });
      jQuery('.slider_pager li').eq(0).addClass('active');
      jQuery('.slider_pager li').click(function () {
          main_slider.goToSlide(jQuery('.slider_pager li').index(jQuery(this)));
          jQuery('.slider_pager li').removeClass('active');
          jQuery(this).addClass('active');
      });
})

Пункты идут в виде списка

<ul class="pages">
                                               <li class="">ОПЦИИ</li>
                                               <li>ИСПАРИТЕЛИ VED E (ЭЛЕКТРИЧЕСКИЕ)</li>
                                               <li>ИСПАРИТЕЛИ VWW IS (ЖИДКОСТНЫЕ)</li>
                                               <li>ИСПАРИТЕЛЬНЫЕ УСТАНОВКИ</li>
                                               <li>СТАНЦИИ АВТОНОМНОГО ГАЗОСАНБЖЕНИЯ</li>
                                               <li>ГАЗОВЫЕ ГЕНЕРАТОРЫ</li>
                                               <li>ИНФОКРАСНЫЕ ИЗЛУЧАТЕЛИ</li>
                                               <li>ПРОЕКТИРОВАНИЕ</li>
                                               <li>СТРОИТЕЛЬСТВО МОНТАЖ ПУСКО-НАЛАДКА</li>
                                               <li>ЭКСПЛУАТАЦИЯ</li>
                                               <li>МЕТАЛЛООЗАГОТОВКА И МЕТАЛЛООБРАБОТКА</li>
                                               <li>ИЗГОТОВЛЕНИЕ ИЗДЕЛИЙ НА ЗАКАЗ</li>
                                           </ul>