Toggle Menu
Правила Размещение ресурсов Правила Размещение ресурсов
Пожертвования Пожертвования
Мы Вконтакте Мы Вконтакте
Красиво оформленный анимированный город

Разработка Красиво оформленный анимированный город

DetectorDevil
Бесплатные Есть обсуждение
Скачивания0
Просмотры78
Оценки0 (0)
Обновление
Нет прав для скачивания
Быстрые действия
Оставить оценку
Условия скачивания Дневной лимит скачиваний исчерпан Подробнее об условиях
ВерсияБез версий
Файлы
Обновлено

Описание ресурса

Пишем код HTML:
HTML:
Expand Collapse Copy
<style type="text/css">
.wrapper {
  width: 100%; /* responsive */
  height: 450px;
  background-color: #f2f2f2; /* to see the size of the wrapper */
}
</style>

<div class="wrapper">
  <div id="target"></div>
</div>

<script src="https://player.animatron.com/latest/bundle/animatron.min.js"></script>
<script type="text/javascript">
anm.Player.forSnapshot(
  'target', /* target tag ID */
  'https://publish.animatron.io/4d9034581b99f90cd71e16b1.json', /* snapshot URL */
  anm.importers.create('animatron'),
  function() {
    var player = this;
    var wrapper = document.querySelector('.wrapper');
    var windowResize = function() {
      var rect = wrapper.getBoundingClientRect();
      console.log(rect);
      player._resize(rect.width, rect.height);
    };
    windowResize();
    window.addEventListener('resize', windowResize);
  },
  {ribbonsColor: 'transparent', controlsEnabled: false, autoPlay: true, repeat: true}
);
</script>

Получаем следующий результат:
[topforo.ru]_dsf13.gif
Анимация при наведении курсора на кнопку, CSS-маски (экспериментальная) Предыдущий ресурс Анимация при наведении курсора на кнопку, CSS-маски (экспериментальная) Следующий ресурс Эффект с текстом с помощью CSS Эффект с текстом с помощью CSS

Похожие ресурсы

view_all
Красиво оформленный анимированный город
Нет прав для скачивания
online
Темы 1.153
Сообщения 1.567
Пользователи 833
Новый пользователь
Назад
Верх Низ