Проблема с кнопкой закрытия fancybox3 в электронном приложении - PullRequest
0 голосов
/ 29 мая 2020

ПЕРВЫЙ Я понимаю, что не отображается кнопка закрытия - это часто задаваемый вопрос. Я просмотрел большинство сообщений в поисках решения. Однако ничего из этого не помогает, так что это может быть проблема, связанная с электронами.

Моя команда и я создаем электронное приложение. Главная страница приложения - html, основанная на css и js. Fancybox 3 работает как нужно, ЗА ИСКЛЮЧЕНИЕМ кнопки закрытия в правом верхнем углу белого поля. При запуске приложения нажатие кнопки всплывающего окна простого сообщения fancybox работает, но кнопка закрытия не отображается. Однако функциональность есть, я могу щелкнуть область, и она закроется.

Раздел HTML на первой странице. - «О нас» - это кнопка, связывающая fancybox.

<p data-aos="fade-up" data-aos-delay="100"><a id="about" href="javascript:;" 
class="btn btn-primary btn-md smoothscroll">About</a></p>

javascript для кнопки

$("#about").on('click', function() {
  $.fancybox.open(
    '<div class="message"><h2>OATES User Interface</h2><p>Welcome to the OUI! (pronounced weeee!, like the Frenchies)</p></div>');
});

скриншот для справки. отсутствует скриншот кнопки закрытия

Как ни странно, когда я беру эти два блока кода и помещаю их в индекс шаблона. html и JS скрипт и открываю его в браузере, кнопка закрытия показывает и работает нормально. Видно ЗДЕСЬ

Я попытался решить эту проблему, используя другой сценарий для JS, но я недостаточно знаком с fancybox, чтобы настроить всплывающее окно простого сообщения. Это то, что я пробовал, но он неправильно читает html и помещает кнопку закрытия в правом верхнем углу окна приложения.

$("#about").on('click', function() {

  $.fancybox.open({
    showCloseButton : 'true',
    tpl : '<div class="message"><h2>OATES User Interface</h2><p>Welcome to the OUI! (pronounced weeee!, like the Frenchies)</p>'
  });
});

Посмотрите ЗДЕСЬ

ЕСЛИ кто-то имеет опыт работы с Fancybox3 внутри электрона или может определить, что я делаю не так с моей попыткой решения, чтобы получить HTML в показать правильно, дайте мне знать. Любая помощь будет оценена. Заранее спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...