Magnific Popup - начальная галерея из второго элемента массива

Question

Я хотел бы узнать, как изменить масштабный всплывающий код для управления массивом образов, созданных для создания галереи, а не из пункта 0 (первое изображение галереи), но с 1 (второе изображение галереи). Мне нужно сделать небольшую смену логики в галерее. Текущее поведение - когда один из миниатюр, щелкнувших по галерее, открывается галерея всплывающих окон с изображением эскиза. Мне нужно сделать следующее изображение в галерее из этого массива. Скажем. У меня есть галерея из 4 изображений. Миниатюра - это первое изображение из галереи. При щелчке мне нужно загрузить второе изображение из галереи. Любая помощь высоко ценится! Заранее спасибо.

Вот код функции.

function lightbox() { 
 
     $('.lightbox').magnificPopup({ 
 
      delegate: 'a', 
 
      type: 'image', 
 
      gallery:{ 
 
       enabled:true, 
 
       arrowMarkup: '<button title="%title%" type="button" class="mfp-arrow mfp-arrow-%dir%"><img src="img/assets/slider-left-thin-arrow.png"></button>', 
 
      }, 
 
      mainClass: 'mfp-zoom-in', 
 
      removalDelay: 500, //delay removal to allow out-animation 
 
      callbacks: { 
 
       beforeOpen: function() { 
 
        this.st.image.markup = this.st.image.markup.replace('mfp-figure', 'mfp-figure mfp-with-anim'); 
 
       } 
 
      },  
 
      closeMarkup: '<button title="%title%" type="button" class="mfp-close"></button>', 
 
      midClick: true 
 
     }); 
 
    }

Answer 1

Использование beforeOpen обратного вызова, получить экземпляр и вызвать next() на экземпляре

callbacks: { 
    beforeOpen: function() { 
    var mfp = $.magnificPopup.instance; // instance of magnificPopup 
    mfp.next(); 
    } 
} 

UPDATE: Если первый элемент не должен отображаться, то нет необходимости в next() просто склеить его из массива и индексов items будет хорошо

callbacks: { 
    beforeOpen: function() { 
     var mfp = $.magnificPopup.instance; // instance of magnificPopup  
     mfp.items.splice(0, 1); 
     mfp.updateItemHTML(); 
    } 
} 

Answer 2

Спасибо, новичок! Я смог перейти к следующему экземпляру элемента. Ниже приведен код. Мне пришлось изменить функцию (e) 'на функцию(), и она начала работать правильно.

Однако мне нужно сначала удалить первый элемент из коллекции массивов. что было бы лучшим решением для достижения этого? Еще раз спасибо!

function lightbox() { 
 
     $('.lightbox').magnificPopup({ 
 
      delegate: 'a', 
 
      type: 'image', 
 
      gallery:{ 
 
       enabled:true, 
 
       arrowMarkup: '<button title="%title%" type="button" class="mfp-arrow mfp-arrow-%dir%"><img src="img/assets/slider-left-thin-arrow.png"></button>', 
 
      }, 
 
      mainClass: 'mfp-zoom-in', 
 
      removalDelay: 500, //delay removal to allow out-animation 
 
      callbacks: { 
 
       beforeOpen: function() { 
 
\t \t \t \t \t var mfp = $.magnificPopup.instance; 
 
    \t \t \t \t mfp.next(); 
 
        this.st.image.markup = this.st.image.markup.replace('mfp-figure', 'mfp-figure mfp-with-anim'); 
 
       } 
 
      },  
 
      closeMarkup: '<button title="%title%" type="button" class="mfp-close"></button>', 
 
      midClick: true 
 
     }); 
 
    }

Спасибо!