| FirstRelict |
23.01.2014 12:06 |
Трансформация элемента
Вот тут на сайте https://vimeo.com/player
Плеер в шестиграннике, и по клику он превращается в прямоугольник.
как реализовать такую штуку, скажите пожалуйста в каком направлении читать(двигаться)??
Нашел как делать ромб на css
<html>
<head>
<style type="text/css">
#hexagon {
width: 100px;
height: 55px;
background: red;
position: relative;
}
#hexagon:before {
content: "";
position: absolute;
top: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid red;
}
#hexagon:after {
content: "";
position: absolute;
bottom: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid red;
}
</style>
</head>
<body>
<div id="hexagon"></div>
</body>
</html>
думал как то менять параметры, и что то выйдет из этого...увы пока ничего. |