Какая библиотека начальной загрузки нужна для использования модального тела?

#html #css #bootstrap-modal

Вопрос:

У меня есть следующий HTML, но он не отображает модальный диалог начальной загрузки. Может быть, мне нужна другая версия Bootstrap?

 <link href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.7.0/css/mdb.min.css" rel="stylesheet">

<div class="modal-body">
  <div style="text-align: center">
    <i class="fas fa-check fa-4x mb-3 animated rotateIn"></i>
    <h5>#if(campaign.creatorID == "FE4E6920-A920-4AEB-8977-60BF51EC1CE7"){Merci de coller le texte après avoir continué.}else if(campaign.creatorID == "0B4DC579-EB0E-47E9-B5C2-F2EB3B1BFFC7"){Plak de tekst na het doorgaan.}else{#if(whitelabel.pleasePasteAfterContinuing){#(whitelabel.pleasePasteAfterContinuing)}else{Please paste the text after continuing.}}<br/></h5>
  </div>
</div>
 

Комментарии:

1. Нет, но вам также нужно использовать файлы JS. Не только css будет работать со всеми функциями.

Ответ №1:

Только CSS-файлы не будут работать должным образом. Вам также необходимо добавить файлы Javascript для выполнения всех функций.

Ответ №2:

Начиная с начальной загрузки версии 4.0 модальное тело используется внутри модального класса. https://mdbootstrap.com/docs/standard/components/modal/

А также вам нужно добавить файлы js.

Ответ №3:

Перейдите по следующей ссылке Введение — Начальная загрузка.

Прежде чем вам даже понадобится прокрутить страницу вниз, вы увидите необходимые сценарии начальной загрузки, а также таблицы стилей.

Убедитесь, что вы ссылаетесь на таблицы стилей в своих <head></head> сценариях, прежде чем писать вот так!

 <!DOCTYPE html>
<html>
  <head>
  
  <!--Stylesheets-->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    
    <!--Scripts-->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X 965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH 8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM B07jRM" crossorigin="anonymous"></script>

  </head>
  
  <body>
  
  </body>
</html>
 

Смотрите Модальный загрузчик

Комментарии:

1. Он добавил стили для начальной загрузки Material Design, но вы правы. Ему нужно добавить файлы js.

Ответ №4:

Скопируйте и вставьте таблицу стилей в свою перед всеми другими таблицами стилей, чтобы загрузить наш CSS.

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA 058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
 

Для работы многих наших компонентов требуется использование JavaScript. В частности, для них требуется jQuery и наши собственные плагины JavaScript. Поместите следующие теги в конце ваших страниц, прямо перед закрывающим тегом, чтобы включить их. На первом месте должен быть jQuery, а затем наши плагины JavaScript.

 <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5 76PVCmYl" crossorigin="anonymous"></script>
 

Я надеюсь, что это поможет вам