Движущиеся шары на странице

Wed, 27 Nov 2019 23:18:06 +0200

Движущиеся шары на странице, очень приятные. Можно реализовать сколько угодно штук

<div class="balls">
	<div class="balls_item balls_small"></div>
	<div class="balls_item balls_medium"></div>
	<div class="balls_item balls_big"></div>
</div>
<style>
	.balls .balls_item {
		background-color: rgba(255,255,255,0.2);
		border-radius: 50%;
		display: block;
		position: absolute;
		z-index: 0;
		margin: auto;
	}
	.balls .balls_item.balls_small {
		width: 67px;
		height: 67px;
		animation: CircleLeft 60s linear infinite;
	}
	.balls .balls_item.balls_medium {
		width: 218px;
		height: 218px;
		animation: CircleRight 70s linear infinite;
	}
	.balls .balls_item.balls_big {
		width: 350px;
		height: 350px;
		animation: CircleLeft 85s linear infinite;
	}
	.balls.stop_animation .balls_item {
		animation-play-state: paused;
	}
	@keyframes CircleLeft {
		from {
			transform: rotate(0deg) translate(300px) rotate(0deg);
		}
		to {
			transform: rotate(360deg) translate(300px) rotate(-360deg);
		}
	}
	@keyframes CircleRight {
		from {
			transform: rotate(360deg) translate(200px) rotate(-360deg);
		}
		to {
			transform: rotate(0deg) translate(200px) rotate(0deg);
		}
	}
	</style>

Framework Averin.pro

Fri, 22 Mar 2019 00:19:34 +0200

Пол года назад было принято решение на территории студии разработать и применить собственный CSS Framework. Это такая коллекция css и немного js скриптов, которые мы с радостью применяем в своих разработках. Цель очень проста: уменьшение времени, затраченного на элементарные вещи

По ходу сборки начальных версий как то так само собой было принято сделать его еще и публичным. Любой публичный продукт может, надеюсь, быть оцененными и в следствии улучшенным.

Если 16 января 2019 года была выпущена версия 3.2, то сегодня версия 4.0. И на этот моменте хотелось бы замедлить шаг.

Версия 4.0 — это версия с необычной судьбой. Мы успели поработать с framework, внесли в него много исправлений, даже сделали выводы о его работе и приняли решение что он должен работать по иным принципам.

Принцип прост: Новая версия не имеет свойств оформления стандартных элементов, каждому из них нужно применять соотвествующий класс или серию классов. При этом никто не должен влиять на оформленный элемент. Его может изменить только его личные размеры, цвета и состояния.

На сайте framework уже опубликована новость о принятом решении и в ближайшие дни framework полностью будет перестроен. Подробности можно прочитать в новостях framework: http://framework.averin.pro

Самое интересное впереди!

Блог Артемия Аверина, заметки с тегом: css

Движущиеся шары на странице

Framework Averin.pro