Описание
При нажатии кнопки ”демо” раздвигается блок в котором можно посмотреть, например страницу. Так же есть кнопка ”На весь экран”, из названия кнопки понятно, что демо откроется на весь экран.
Установки:
Зайдите в
Файловый менеджер и создайте папку
css и
js, если они есть, то выполните следующее:
Файл из папки
css (Тот что в архиве), загрузите в папку
css (Ту, что в Файловом менеджере). Тоже самое сделайте и с папкой
js.
Далее, в нужном месте вставьте этот код:
Код
<div class="DS_demo">
<div class="top">
<a href="#" id="open" title="Нажмите чтобы открыть демо | Нажмите ещё раз чтобы закрыть">Демо</a><a href="#" id="fullscreen" style="display: none;" title="Открыть демо на весь экран">На весь экран</a>
</div>
<div class="demo" style="display: none;">
<div class="closed" title="Закрыть демо"><span></span><span></span></div>
<iframe src="ССЫЛКА"></iframe>
</div>
</div>
</div>
Замените слово "ССЫЛКА", на страницу которую хотите отобразить в демо-режиме.
В <head></head> вставьте этот код:
Код
<link href="/css/DS_demo.css" rel="stylesheet"/>
И под </body> этот код:
Код
<script type="text/javascript" src="/js/DS_demo.js"></script>
Всего 3