Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.75/4: Рейтинг темы: голосов - 4, средняя оценка - 4.75
 Аватар для TVPNERO
9 / 8 / 12
Регистрация: 29.03.2016
Сообщений: 1,154

Как сделать анимацию ?

22.10.2016, 20:18. Показов 900. Ответов 3
Метки css (Все метки)

Студворк — интернет-сервис помощи студентам
Нужно чтоб Второй блок(id block_two) выезжал справа налево закрывая собой Первый блок(id block_one ),при наведении мышки на Первый блок.

Интересует либо вариант кода на JS или CSS,без jQuery.

HTML5
1
2
3
4
5
6
<html>
<head>
 
<title>Транзишн</title>
 
<meta charset="utf-8">
CSS
1
2
3
4
5
6
<style>
#block_one{display: inline-block;width: 300px;height: 300px;background: yellow}
 
#block_two{display: inline-block;width: 300px;height: 300px;background: green}
 
</style>
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
</head> 
<body>
 
 
<div id="block_one">Первый блок</div>
 
 
 
<div id="block_two">Второй блок</div>
 
 
    
</body>
</html>
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
22.10.2016, 20:18
Ответы с готовыми решениями:

Как с CountUp.js сделать анимацию?
Ссылка на скрипт: https://github.com/inorganik/CountUp.js Помогите разобраться новичку - как смонтировать скрипт в страницу?

Как сделать анимацию на сайте?
Здравствуйте друзья. Флеш вообще не знаю. Сейчас столкнулся с тем, что нужно сделать на сайте фотографии которые будут сменяться например...

Как сделать плавную анимацию height?
Привет. Создал страницу с верхним меню навигации. При прокрутке контента меню фиксируется и продолжает двигаться с экраном. Проблема...

3
Фрилансер
Эксперт PythonЭксперт JSЭксперт PHP
 Аватар для Azdeman
1871 / 1362 / 604
Регистрация: 12.01.2011
Сообщений: 5,470
22.10.2016, 21:13
Есть jQuery метод
JavaScript
1
animate({});
0
 Аватар для TVPNERO
9 / 8 / 12
Регистрация: 29.03.2016
Сообщений: 1,154
22.10.2016, 22:46  [ТС]
Azdeman, Интересует либо вариант кода на JS или CSS,без jQuery.
0
Фрилансер
Эксперт PythonЭксперт JSЭксперт PHP
 Аватар для Azdeman
1871 / 1362 / 604
Регистрация: 12.01.2011
Сообщений: 5,470
22.10.2016, 23:02
Цитата Сообщение от TVPNERO Посмотреть сообщение
Интересует либо вариант кода на JS или CSS,без jQuery.
https://learn.javascript.ru/animation
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
22.10.2016, 23:02
Помогаю со студенческими работами здесь

Сделать анимацию по примеру
имеется такой пример: http://livedemo00.template-help.com/wt_43436/#!/page_splash хотелось бы сделать такую же анимацию по движению влево...

Как зациклить мою анимацию ?
Как зациклить мою анимацию ? &lt;!DOCTYPE html&gt; &lt;html lang=&quot;en&quot;&gt; &lt;head&gt; &lt;meta charset=&quot;UTF-8&quot;&gt; ...

Как воспроизвести gif анимацию с первого кадра при перезагрузке страницы или перезагрузить изображение?
Есть некое изображение img.gif с анимацией логотипа длительностью 4 секунды. Оно подгружается на страницу в качестве прелоада, в виде...

Как сделать анимацию на js
Есть у меня изображение я хочу чтобы оно перемещалось каждые 20 миллисекунд я незнаю как это сделать помогите!!!

При нажатии на кнопку сделать анимацию загрузки
Есть кнопка &lt;button type=&quot;submit&quot; class=&quot;btn btn-lg btn-custom big&quot; onClick=&quot;yaCounter.reachGoal(''); return true; ga('send',...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Очистка реквизитов документа при копировании
Maks 09.04.2026
Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .
модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий
anaschu 08.04.2026
https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI
Блокировка документа от изменений, если он открыт у другого пользователя
Maks 08.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .
Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка.
Hrethgir 08.04.2026
Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов.
anaschu 08.04.2026
работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ
Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики.
Hrethgir 07.04.2026
Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .
Горе от ума
kumehtar 07.04.2026
Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .
Использование значений реквизитов справочника в документе, с определенными условиями и правами
Maks 07.04.2026
1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru