@Genri_Rus

Как по this выводить модальное окно?

Вот пример: https://codepen.io/Genri_Rus/pen/eYNpLKP

Как сделать, чтобы при клике на первую кнопку выводился Текст №1

А при клике на вторую кнопку - Текст №2

Аналогично при клике на третью кнопку - Текст №3
  • Вопрос задан
  • 234 просмотра
Решения вопроса 2
HistoryART
@HistoryART
Надзиратель
Javascript:
function createPopup(text, element) {
$(element).magnificPopup({
    items: [
      {
        src: `<span>${text}</span>`,
        type: 'inline'
      }
    ],
    gallery: {
      enabled: true
    }
});
}

createPopup('Text', '.open-popup')
createPopup('Text2', '.open-popup2')
createPopup('Text3', '.open-popup3')


Html
<button class="open-popup">Первая кнопка</button>

<button class="open-popup2">Вторая кнопка</button>

<button class="open-popup3">Третья кнопка</button>
Ответ написан
@Genri_Rus Автор вопроса
Вообщем, в связи с тем, что lloydbanks удалил свое решение, то вот его правильный вариант

Имейте ввиду, что данный способ не будет работать так:
$(document).on('click', '.open-popup', function(){
const data = [
  {
    src: '<span>Текст №1</span>',
    type: 'inline'
  },
  {
    src: '<span>Текст №2</span>',
    type: 'inline'
  },
  {
    src: '<span>Текст №3</span>',
    type: 'inline'
  },
]

$.magnificPopup.open({ 
  callbacks: {
    elementParse: function(item) {
      item.src = data[item.index].src;
    }
  }
 });
});
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы