Помогите разобраться с вызовом и оберткой модального окна на бутстрап

InstantCMS 2.X
#1 14 февраля 2023 в 16:34

Плохо знаком с Bootstrap, а на css не хочу городить новые окна.

Суть такая есть id=«content» 

1) Подскажите кодик которым окутать этот id=«content» 

2) и кодик которым вызывать модалку которая уже встроенная в системе Bootstrap, на css так <a href="#content">Открыть</a>

Задача вызвать id=«content»  который спрятан на этой же странице

#3 14 февраля 2023 в 17:08

Вот тут кучка примеров getbootstrap.com/docs/4.6/components/modal/#live-demo

Loadырь

Да мне бы один раз написать на примере моего id, по инструкции что то идет не так. На своем конкретном примере я быстрей вникну.

Вот например :

  1. <!-- Button trigger modal -->
  2. <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#content">
  3. Launch demo modal
  4. </button>
  5.  
  6. <!-- Modal -->
  7. <div class="modal fade" id="content" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  8. <div class="modal-dialog">
  9. <div class="modal-content">
  10. <div class="modal-header">
  11. <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
  12. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  13. <span aria-hidden="true">&times;</span>
  14. </button>
  15. </div>
  16. <div class="modal-body">
  17. ТУТ мое содержимое
  18. </div>
  19. <div class="modal-footer">
  20. <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
  21. <button type="button" class="btn btn-primary">Save changes</button>
  22. </div>
  23. </div>
  24. </div>
  25. </div>

Выводится только статический фон, содержимого нет

Второй вариант если мне нужно спрятать уже существующее id на странице без его обертки, как это сделать тоже не понятно.

Добавлено спустя 4 минуты

С оберткой разобрался, а как спрятать без обертки id на странице?

Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.