@Quiterio

Как сделать всплывающее окно только при запуске сайта с телефона?

Всех приветствую. Как сделать всплывающее окно только для телефона?
Есть код меню(которое должно появляться всплывающе):
хтмл
<div class="showmobile1"><center>123</center></div>
    <div class="showmobile1">321</div>
    <div class="showmobile1">331</div>
    <div class="showmobile1">1113</div>
    <div class="showmobile1">222</div>
    <div class="showmobile1">555</div>

и код цсс(что показ только для телефонов):
spoiler
.showmobile1 { display: none; color: #fff; box-shadow: 0 0 10px #fff; background-color: rgba(23,15,7,.5); border-radius: 10px; 	margin-bottom: 15px; margin-top: 10px; padding: 3px 20px;}
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){ .showmobile1 { display: block; }}

Как это организовать, чтобы было всплывающим?
  • Вопрос задан
  • 206 просмотров
Решения вопроса 1
@Quiterio Автор вопроса
Без всяких скриптов решил проблему, просто потив интернет.
Кому нужно:
хтмл

div id="parent_popup" class="showmobile1">
  <div id="popup" class="showmobile1">
    <p style="cursor: pointer;" onclick="document.getElementById('parent_popup').style.display='none';">Закрыть</p>
    <li>ТЕКСТ</li><br>
    <li>ТЕКСТ</li><br>
    <li>ТЕКСТ</li><br>
    <li>ТЕКСТ</li><br>
    <li>ТЕКСТ</li><br>
    <li>ТЕКСТ</li>
  </div>
</div>



цсс

.showmobile1 {display: none; ваши стили для текста.}
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){ .showmobile1 { display: block; }}

Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@IIIaTaTeJIb
WEB-программист
Можно добавить css анимации, или скрипты на JavaScript. В чём проблема то?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы