Архив метки: анимацию

От автора: анимация CSS очень интересна; ее красота состоит в том, что с помощью множества простых свойств можно сделать что угодно от элегантного плавного проявления до очень красивых эффектов. Одно из средств CSS, находящееся где-то в промежутке между ними – это эффект переворота CSS, где при этом на обеих сторонах контейнера, как с лицевой, так и изнаночной, имеется контент. Этот учебник покажет вам, как легко и просто создать его. Краткое примечание: это не первый учебник о подобном эффекте, но все остальные показались мне слишком сложными. Во многие другие статьи добавлены дополнительные стили для кодирования примеров, требующие затем от читателя расшифровки, что из них нужно, а что нет. В данном учебнике этот вопрос опускается, предоставляя вам только необходимые стили; можете украсить любую сторону каждого оборота как вам заблагорассудится. ДЕМО HTML Структура HTML для получения ожидаемого вами двустороннего эффекта: 01.<div class=»flip-container» ontouchstart=»this.classList.toggle(‘hover’);»> 02.<div class=»flipper»> 03.<div class=»front»> 04.<!— front content —> 05.</div> 06.<div… Читать далее »