HTML часть. Не забываем подключить jquery.
Burger menu
Трансформация 3D карточки-поворот на 180 градусов CSS3
CSS трансформация с использованием transform
HTML часть
Адаптивная верстка
Пример на github
Читать далее «CSS трансформация с использованием transform»Переворачиваем карточку на 180 градусов с помощью CSS
Анимация градиента с плагином granim.js
Предварительно необходимо скачать и подключить сам скрипт https://sarcadass.github.io/granim.js/
HTML часть
CSS часть
#canvas-basic,
#canvas-radial {
position: relative;
display: block;
width: 100%;
height: 300px;
margin-bottom: 20px;
}
Читать далее «Анимация градиента с плагином granim.js»Отдельные стили CSS через js для любимого IE )
Меняющийся фон сайта на градиенте
Просто добавляем в css
body{
background: linear-gradient(326deg, #316155, #5fc370, #b8c35f, #c3905f);
background-size: 800% 800%;
-moz-animation: screenplug 11s ease infinite;
-o-animation: screenplug 11s ease infinite;
animation: screenplug 11s ease infinite;}
@-webkit-keyframes screenplug {
0%{background-position:14% 0%}
50%{background-position:87% 100%}
100%{background-position:14% 0%}
}
@-moz-keyframes screenplug {
0%{background-position:14% 0%}
50%{background-position:87% 100%}
100%{background-position:14% 0%}
}
@-o-keyframes screenplug {
0%{background-position:14% 0%}
50%{background-position:87% 100%}
100%{background-position:14% 0%}
}
@keyframes screenplug {
0%{background-position:14% 0%}
50%{background-position:87% 100%}
100%{background-position:14% 0%}
}
Пример тут
