Javascript-форум - залипание слайдера при повторном вызове в всплывающем окне

Добрый день!

Подскажите пожалуйста что не так в коде.

Есть разметка страницы:

<div class="item-box">
    <div class="proektu-item"></div>
    <div class="proektu-item"></div>
</div>
<div class="item-box">
    <div class="proektu-item"></div>
    <div class="proektu-item"></div>
</div><div class="item-box">
    <div class="proektu-item"></div>
    <div class="proektu-item"></div>
</div> 

<div class="item">
    <div class="item-wrap">
        <div class="item-close"><i class="icon-cancel"></i></div>                                             
        <div class="slider">
            <div class="slider-nav">
                <span class="slider-left"></span>
                <span class="slider-right"></span>
            </div>
            <div class="slider-wrap">                                   
                <div class="slides">
                    <div class="slide"></div>
                    <div class="slide"></div>
                    <div class="slide"></div>                                            
                </div>
            </div>
        </div>
        <div class="slider-dots"></div>                                        
    </div>
</div>
<div class="item">
    <div class="item-wrap">
        <div class="item-close"><i class="icon-cancel"></i></div>                                             
        <div class="slider">
            <div class="slider-nav">
                <span class="slider-left"></span>
                <span class="slider-right"></span>
            </div>
            <div class="slider-wrap">                                   
                <div class="slides">
                    <div class="slide"></div>
                    <div class="slide"></div>
                    <div class="slide"></div>          
                </div>
            </div>
        </div>
        <div class="slider-dots"></div>                                        
    </div>
</div>
<div class="item">
    <div class="item-wrap">
        <div class="item-close"><i class="icon-cancel"></i></div>                                             
        <div class="slider">
            <div class="slider-nav">
                <span class="slider-left"></span>
                <span class="slider-right"></span>
            </div>
            <div class="slider-wrap">                                   
                <div class="slides">
                   <div class="slide"></div>
                    <div class="slide"></div>
                    <div class="slide"></div>                                       
                </div>
            </div>
        </div>
        <div class="slider-dots"></div>                                        
    </div>
</div>

функционал таков:
изначально все item скрыты,отображаются только item-box и вложенные блоки proektu-item.
По клику на один из proektu-item во всплывающем окне загружается item, соответствующий его порядковому номеру.
Блок item содержит слайдер с навигацией по слайдам, слайды можно полистать, посмотреть и потом закрыть весь блок item.
Во время первого вызова блока item все работает хорошо, а вот при повторном вызове этого же блока навигация по слайдам во время перелистывания сходит с ума, перескакивает через точку, а потом и вовсе исчезает. Если открыть другой item, то на первый раз все работает хорошо, а вот с повторного все едет.

код всплывающей формы такой:

$(".proektu-item").click(function() {
  $(".items .item").hide().eq($(".proektu-item").index(this)).fadeIn().addClass('active');

  $(document).ready(function sliderItems() { // Ждём загрузки страницы
  
  var slideCount = $('.items .item.active .slider .slides .slide').length;  //количество слайдов
   for (var n=0; n<slideCount; n++)                      // Цикл добавляет буллеты в блок .bullets
    {
      html=$('.item.active .slider-dots').html() + '<div class="slider-dot"></div>';          // К текущему содержимому прибавляется один буллет
      $('.item.active .slider-dots').html(html);                   // и добавляется в код
    };
    var j = 0;
    $('.item.active .slider-dots .slider-dot').eq(j).addClass('active');
      
  }); 
      $(function(){               
      var slides = $(".item.active .slider .slides").children(".slide"); // Получаем массив всех слайдов
      var width = $(".item.active .slider-wrap").width(); // Получаем ширину видимой области
      var i = slides.length;   // Получаем количество слайдов
      var offset = i * width; // Задаем начальное смещение и ширину всех слайдов
      i--; // уменьшаем кол-во слайдов на один ( для проверки в будущем )
      $(".item.active .slider .slides").css('width',offset); // Задаем блоку со слайдами ширину всех слайдов  
      offset = 0; // Обнуляем смещение, так как показывается начала 1 слайд
        $(".item.active .slider-right").click(function(){ // Событие клика на кнопку "следующий слайд"
          if (offset < width * i) { // Проверяем, дошли ли мы до конца
            offset += width; // Увеличиваем смещение до следующего слайда
            $(".item.active .slider .slides").css("transform","translate3d(-"+offset+"px, 0px, 0px)"); // Смещаем блок со слайдами к следующему
            $('.item.active .slider-dots .slider-dot.active').next('.slider-dot').addClass('active');
              $('.item.active .slider-dots .slider-dot.active').eq(0).removeClass('active');      
          }
        });
        $(".item.active .slider-left").click(function(){ // Событие клика на кнопку "предыдущий слайд"
          if (offset > 0) { // Проверяем, дошли ли мы до конца
            offset -= width; // Уменьшаем смещение до предыдущего слайда
            $(".item.active .slider .slides").css("transform","translate3d(-"+offset+"px, 0px, 0px)"); // Смещаем блок со слайдами к предыдущему
            $('.item.active .slider-dots .slider-dot.active').prev('.slider-dot').addClass('active');
            $('.item.active .slider-dots .slider-dot.active').eq(1).removeClass('active');      
          }
        });
        $('.item.active .slider-dots .slider-dot').click(function(){
          $('.item.active .slider-dots .slider-dot').removeClass('active').eq($(this).index()).addClass('active');
          // if (offset < width * i) { // Проверяем, дошли ли мы до конца
            offset += -offset+width*$(this).index(); // Увеличиваем смещение до следующего слайда
            $(".item.active .slider .slides").css("transform","translate3d(-"+offset+"px, 0px, 0px)");
        });
     });
  });
     $(".icon-cancel").click(function(){
       $(".item.active .slider .slides").css("transform","translate3d(-"+0+"px, 0px, 0px)");  
       $('.item.active .slider-dots .slider-dot.active').remove('active');
       $(".items .item.active").fadeOut("slow").removeClass('active'); 
       $('.item .slider-dots .slider-dot').remove();

  });

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