Загрузка контейнера по клику в HTML

J
На сайте с 30.11.2005
Offline
121
312

Привет, помогите решить задачу.

Есть сайт, на некоторых его страницах есть контейнеры <iframe></iframe> с игрой, которая подгружается с другого сайта.

Я хочу, чтобы при загрузке страницы, на месте контейнера подгружалась PNG картинка. А уже при клике на эту картинку - она пропадает и на ее месте подгружается Iframe контейнер с игрой.

Надеюсь это можно реализовать в HTML, не подключая скрипты?

S
На сайте с 30.09.2016
Offline
469
#1
Juggernaut:
не подключая скрипты

Через javascript. Если не подключая, то включая.

Отпилю лишнее, прикручу нужное, выправлю кривое. Вытравлю вредителей.
LEOnidUKG
На сайте с 25.11.2006
Offline
1591
#2
Надеюсь это можно реализовать в HTML, не подключая скрипты?

HTML это НЕ язык программирования, в нём нельзя ничего заменять, подгружать и т.д.

Через Javascript без проблем, делайте.

✅ Трастовых площадок под размещение статей и ссылок. Опыт 12 лет! ( https://searchengines.guru/ru/forum/675690 ) ⭐ Купить вечные трастовые ссылки для сайта ( https://getmanylinks.ru/?srh ) ⭐ Ускорение ваших сайтов (WP, Opencart и др.) + Настройка сервера ( https://searchengines.guru/ru/forum/997205 )
ArbNet
На сайте с 27.10.2019
Online
77
#3

Без скрипта на CSS можно, через label input

Блажен, кто не стремится сделать лучше: он не рискует быть не понятым.
IL
На сайте с 20.04.2007
Offline
418
#4
LEOnidUKG:
HTML это НЕ язык программирования, в нём нельзя ничего заменять, подгружать и т.д.

Нынче css даёт солидный простор для фантазии:

#iframe_container input ~ iframe {display:none;}
#iframe_container input:checked ~ iframe {display:block;}

"Спрятать input в картинку" и сделать "выбирабельным" тоже вполне реально.. =)

Juggernaut:
Надеюсь это можно реализовать в HTML, не подключая скрипты?

Однако, откуда такое скриптовое нежелание?

... :) Облачные серверы от RegRu - промокод 3F85-3D10-806D-7224 ( http://levik.info/regru )
LEOnidUKG
На сайте с 25.11.2006
Offline
1591
#5
Нынче css даёт солидный простор для фантазии:

Слишком пока слабенькое по поддержке это всё. Но делать из CSS язык программирования это тупо :)

S
На сайте с 30.09.2016
Offline
469
#6
ivan-lev:
#iframe_container input ~ iframe {display:none;}

#iframe_container input:checked ~ iframe {display:block;}

Всё равно же загрузится.

WebJunior
На сайте с 11.06.2010
Offline
138
#7

Просто на две страницы сделай, на первой ссылка на страницу с игрой, в виде картинки.

Мой сайт на этом хостинге - https://tuthost.ua/?from=2558 / Верстаю шаблоны (темы с отзывами: https://searchengines.guru/ru/forum/716605, https://searchengines.guru/ru/forum/600404 ).
LEOnidUKG
На сайте с 25.11.2006
Offline
1591
#8
WebJunior:
Просто на две страницы сделай, на первой ссылка на страницу с игрой, в виде картинки.

Интересная мысль кстати, но надо не забыть их закрыть на индексацию.

J
На сайте с 30.11.2005
Offline
121
#9

Ок, спасибо. Значит сделаем через Яваскрипт. Если у кого есть время и желание заработать X сотен рублей, стукните в личку.

D.iK.iJ
На сайте с 26.05.2013
Offline
184
#10

Грузите во фрейме страницу с картинкой и по клику на нее - переходите во фрейме на страницу с игрой.

Грузите во фрейме картинку и по клику по какой-то ссылке на странице идет указание target - на фрейм. Игра откроется во фрейме.

Остальное - обычная вставка по onclick.

Адаптивный дизайн в 2 строчки ( https://dikij.com/wm/adaptaciya-saytov.php ). + Принимаю заказы любой сложности ( https://searchengines.guru/ru/forum/926323 ). 💎 Еще я делаю классные кулоны с опалами ( https://mosaicopal.ru/ ).

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий