Интернет магазин шабонов
Форма входа

Бесплатный раздел

Уважаемые пользователи!
Доводим до вашего сведения, что мы не занимаемся обучениями по системе uCoz и настройками Ваших сайтов.
Подобные просьбы и вопросы - будут игнорироваться!

Скрипт затемнение экрана при просмотре видео Ucoz

Дата добавления: 24.01.2015 - 08:59
Добавил: Buger
Количество просмотров: 926
Количество комментариев: 1
Рейтинг материала: 5.0 / 2
Скрипт затемнение экрана при просмотре видео Ucoz
БЕСПЛАТНО
Для скачивания файлов, необходима авторизация или регистрация на нашем ресурсе.
рейтинг 5.0
/
голосов 2
Данный скрипт предназначен для того, чтобы пользователь при просмотре видео смог затемнить весь сторонный вид эмитируя "выключение света". Конечно же как вы поняли данная функция будет полезна для сайтов онлайн кинотеатров и кино-тематики.
Установка скрипта очень проста, достаточно внимательно почитать инструкцию ниже.

И так, что нужно проделать:
1. Зайти в панель управления сайтом, найти и открыть код Страница материала и коментария к нему:

Перед закрывающим тегом </head> вставить следующий код:
Код
<script>
  function toggle () {
  var perde = document.getElementById("perde");
  if (perde.style.display != "block")
  perde.style.display = "block";
  else
  perde.style.display = "none";
  }
  </script>

Затем найти тег <body> и добавть ниже:
Код
<div id="perde"></div>


2. Затем переходим в CSS стили и вставляем в самом низу, следующее:
Код
#perde {
  display: none;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.8;
  filter: alpha(opacity=80);
  z-index: 100;
  }
   
  .ac-kapa {
  position: relative;
  background-color: tomato;
  z-index: 101;
  padding:10px;
  color:white;
  text-align:center;
  text-decoration:none;
  }
  .video {
  position: relative;
  z-index: 101;
  display:block;
  }

3. Далее опять нужно перейти в код Страница материала и коментария к нему вашего сайта и в нужном вам месте установить кнопку Включить / Выключить свет там где вы хотите ее видеть:
Код
<a href="javascript:;" class="ac-kapa" onclick="toggle();">Включить свет / Выключить свет</a>

Прошу обратить внимания на то, что Вы можете стилизовать данную кнопку под свои нужды и под дизайн вашего сайта. Например, можно добавить визуальный эффект, а не текст. Но для этих изменений необходимы, как минимум пользовательские знания css/css3.

4. Ну и в завершении, область, где используется видео-плеер для редактирования, надо немного изменить прописав несколько символов:
Код
<div class="video">Тут код видео плеера</div>

На этом установка закончена. Всем спасибо за внимание!

Источник: Не указан
mever
15.07.2015 - 01:51
Трудновато что то установить скрипт, я потратил пол часа чтобы понять в чем же прокол, того что установил выключает только вот весь обзор а у меня видео плеер под див видеоплеера стоит автоматическое изменение из за этого походу.... Но скрипт стоющий хороший скрипт, автору + за отличное описание, понятное внятное....
Добавлять комментарии могут только зарегистрированные пользователи.