Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.12.2021, 19:25
Аспирант
Отправить личное сообщение для Alexander3928 Посмотреть профиль Найти все сообщения от Alexander3928
 
Регистрация: 19.05.2021
Сообщений: 69

Переиспользуемое модальное окно без REACT
Как можно сделать переиспользуемое модальное окно на чистом JS? На React это легко сделать + есть даже видео на ютубе.

На React внутри модального она используют {children}

<div class="modal" id="modal">
    <div class="modal__container">
           [B]И тут сам контент[/B]
    </div>
</div>
Ответить с цитированием
  #2 (permalink)  
Старый 02.12.2021, 19:28
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 13,608

Сообщение от Alexander3928
переиспользуемое модальное окно на чистом JS
Дык!
Ответить с цитированием
  #3 (permalink)  
Старый 02.12.2021, 19:32
Аспирант
Отправить личное сообщение для Alexander3928 Посмотреть профиль Найти все сообщения от Alexander3928
 
Регистрация: 19.05.2021
Сообщений: 69

ksa,
Извиняюсь, но у меня браузер Яндекс не поддерживается
Ответить с цитированием
  #4 (permalink)  
Старый 02.12.2021, 22:34
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 1,576

Модальное окно непросто сделать. Код большой.
Ответить с цитированием
  #5 (permalink)  
Старый 03.12.2021, 00:34
Аспирант
Отправить личное сообщение для Alexander3928 Посмотреть профиль Найти все сообщения от Alexander3928
 
Регистрация: 19.05.2021
Сообщений: 69

voraa,
Цитата:
Модальное окно непросто сделать. Код большой
Сложно создать модальное окно? Или переиспользование? Что именно
Ответить с цитированием
  #6 (permalink)  
Старый 03.12.2021, 06:43
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 1,576

Я не слишком знаю, что такое переиспользуемое, но модальное окно должно полностью брать на себя все действия пользователя. И мышь, и клавиатура... Пока окно не закрыто, все действия возможны только с ним. Т.е необходимо заблокировать действия пользователя со страницей. Ни нажатия кнопок, ни скроллинг, ни нажатия клавиш. Даже смена по нажатию TAB должна осуществляться только в этом окне. Ну как в окне alert. Пока не закрыл, ничего другого сделать невозможно.
На автомате этого не получишь, все это надо программить.

А если этого нет, то это просто какое то окно, но не модальное.
Ответить с цитированием
  #7 (permalink)  
Старый 03.12.2021, 08:51
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 13,608

Сообщение от Alexander3928
у меня браузер Яндекс не поддерживается
Вот несколько ссылок оттуда...
https://xakplant.ru/2018/11/19/мо...ызвать/
https://smartlanding.biz/kak-sdelat-...-na-sajte.html
https://addmorescripts.github.io/hys.../index_ru.html
Ответить с цитированием
  #8 (permalink)  
Старый 03.12.2021, 23:50
Аспирант
Отправить личное сообщение для Alexander3928 Посмотреть профиль Найти все сообщения от Alexander3928
 
Регистрация: 19.05.2021
Сообщений: 69

Вы не правильно меня поняли. Мне не нужно объяснение как делать модальное окно, я это умею уже. Я хочу узнать как для одного модального окна менять контент (картинка,кнопки,текст в общем информация которая показывает модальное окно). То-есть переиспользование
Ответить с цитированием
  #9 (permalink)  
Старый 04.12.2021, 16:00
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 13,608

Сообщение от Alexander3928
Я хочу узнать как для одного модального окна менять контент (картинка,кнопки,текст в общем информация которая показывает модальное окно). То-есть переиспользование
В примерах, что я дал ссылки, как раз и показано как такое "окно" можно переиспользовать...

Просто меняешь один контент на другой.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как закрыть модальное окно FancyBox? maxg5 jQuery 0 22.02.2020 20:22
Как передать параметр в модальное окно? andrey8501 Общие вопросы Javascript 6 11.10.2019 21:44
Изменить скрипт, чтобы текст вышел на месте кнопки, а не через модальное окно. hornikot Общие вопросы Javascript 1 09.05.2014 22:00
Как передать переменную в модальное окно sinsir jQuery 24 20.06.2013 16:59
Как можно перемещать модальное окно? izcian Общие вопросы Javascript 2 06.10.2012 19:20