Задать вопрос
@Amenov_Abdul
javascript

Как вызвать одно модальное окна с разных кнопок?

Крч я даже не знаю как правильно сформулировать это, но попробую. Пишу щас сайт вот ссылка: www.bn-transit.com и у меня есть модальное окно бесплатная консультация, так вот я id на кнопку повесил и на другие кнопки на страницу там так: тыкаешь на кнопку и она задает класс active модалке, но когда тыкаешь на другие кнопки ничего не срабатывает, работает только одна кнопка. Кто понял прошу народ помогите плз.

Надо чтобы кликаешь на кнопку "оставить заявку" и модальному class="active" добавился а также и на кнопку "заказать бесплатную консультацию".

$('#trigger-consult-form').click(function() {
    $('.consult-wrapper').addClass('active');
    $('body').css({
      'overflow':'hidden'
    });
  });
  $('.consult-wrapper .close').click(function() {
    $('.consult-wrapper').removeClass('active');
    $('body').css({
      'overflow':'auto'
    });
  });
  • Вопрос задан
  • 831 просмотр
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 1
@Camaro67
Помог? - "Отметить решением"
Вы сегодня сговорились? :) Id должен быть уникальным на всю страницу, нельзя дублировать id! Используйте вместо id какой-нибудь класс.
Ответ написан
5 комментариев
5 комментариев
Пригласить эксперта
Ответы на вопрос 1
xakplant
@xakplant
Автор сайта xakplant.ru
Специально для этого сделал модалку. Вот ссыла
Внизу нужно кое-что переопределить
new XMC({
    bodyID: 'rara',  // id для блока с контентом
    backgroundLayerID: 'lusia',  //id для фона
    selector: 'data-type', // атрибут у кнопок которые вызывают эту модалку
    selectorValue: 'openModalForm', // Значение атрибута
    btnId: 'fbgmfClose',
    content: 'Привет', // Содержание модалки
    classListBg: ['zuzu', 'zaza'], // Классы для wrappera
    classListBody: ['zuzu', 'zaza2'], // Классы для блока с содержанием
    classListBtn: ['zuzu', 'zaza3'], // Классы для кнопки закрыть
    styleBg: {          // Стили врапера. Пишем по js-су
        top: '0',
        left:'0',
        right: '0',
        bottom: '0',
        position: 'fixed',
        background: '#00000090',
        justifyContent: 'center',
        alignItems: 'center',
        zIndex: '6'
    },
    styleBody: {      // Стили блока с контентом. Пишем по js-су
        minWidth: '200px',
        minHeight: '200px',
        background: '#ffffff',
        justifyContent: 'center',
        alignItems: 'center',
    },
    btnStyle: {   // Стили кнопки закрыть. Пишем по js-су
        width: '40px',
        height: "40px",
        background: '#ffffff',
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center',
        position: 'absolute',
        top: '5%',
        right: '5%',
        cursor: 'pointer'
    }
});
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
summer • Ярославль
от 100 000 до 140 000 ₽
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Дописать функцию на Flutter, работа с yandex map kit
20 апр. 2024, в 04:18
3000 руб./за проект
Английская версия для сайта на WordPress
20 апр. 2024, в 03:34
8000 руб./за проект
Доработать клиентское приложение для GTA 5 на C#
20 апр. 2024, в 00:51
1000 руб./за проект
Ещё заказы