Почему модальные формы, открытые с помощью метода JS show, показывают уродливое модальное окно?

  • Автор темы Sproot1
  • 25
  • Обновлено
  • 12, May 2024
  • #1
Привет, У меня есть страницы с пользовательским дизайном html/css/jquery, на которых модальные формы открываются несколько необычным для меня способом: не с помощью JS-кода, а в виде ссылок:
  function modalSigninOpen() {
console.log('modalSigninOpen::')
$('#modal-signin').show();
}
HTML: и форма входа:
 <a onclick="modalSigninOpen(); return false;" class="header__search"> <svg width="15" height="15"> <use xlink:href="/img/sprite.svg#search"></use> </svg> </a> ... 
HTML: я пытаюсь переделать его и открыть JS-код, так как мне нужно прочитать некоторые данные из базы данных с помощью ajax, когда я открываю модальную форму. Я пытаюсь сделать то же самое с кодом JS, используя метод .show:
  <div id="modal-signin" class="modal modal-signin"> <div class="modal-title"> LOGIN </div> <div class="form-signin"> <form action="">
HTML:
  <a href="#modal-signin" class="header__signIn" data-modal><span>BUTTON TO OPEN LOGIN MODAL</span></a> 
Код (JavaScript): модальная форма открывается, но выглядит некрасиво и не по центру. Пожалуйста, откройте сайт по адресу http://photographers.my-demo-apps.tk/

и попробуйте нажать кнопки «Ввод/Поиск» в правом верхнем углу: https://prnt.sc/26kr0wp

Какие методы мне следует использовать и как это можно исправить?

Спасибо!

Sproot1


Рег
05 Mar, 2013

Тем
2

Постов
2

Баллов
22
Тем
49554
Комментарии
57426
Опыт
552966

Интересно