suppression du coverflow
This commit is contained in:
@ -1,95 +0,0 @@
|
||||
.coverflow
|
||||
{
|
||||
padding: 2%;
|
||||
}
|
||||
|
||||
.coverflow ul
|
||||
{
|
||||
width: 90%;
|
||||
padding: 0;
|
||||
perspective: 500px;
|
||||
-webkit-perspective : 500px;
|
||||
-moz-perspective : 500px;
|
||||
}
|
||||
|
||||
.coverflow ul li{
|
||||
padding-top : 4%;
|
||||
display: inline-block;
|
||||
width: 180px;
|
||||
height: 280px;
|
||||
background: orangered;
|
||||
margin-right: -60px;
|
||||
transform: rotateY(45deg);
|
||||
-webkit-transform :rotateY(45deg);
|
||||
-moz-transform :rotateY(45deg);
|
||||
position: relative;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
/* l'element actif element */
|
||||
.coverflow ul li:nth-child(1)
|
||||
{
|
||||
display: inline-block;
|
||||
width: 220px;
|
||||
height: 320px;
|
||||
background: orangered;
|
||||
-webkit-transform :rotateY(0deg) scale(1.2);
|
||||
-moz-transform :rotateY(0deg) scale(1.2);
|
||||
transform: rotateY(0deg) scale(1.2);
|
||||
|
||||
z-index: 55;
|
||||
}
|
||||
|
||||
/* z-index du premier et dernier element (derrière) */
|
||||
.coverflow ul li:first-child,
|
||||
.coverflow ul li:last-child{
|
||||
|
||||
z-index: 45;
|
||||
}
|
||||
|
||||
/* les elements qui suivent l'element central */
|
||||
.coverflow ul li:nth-child(1) ~ li
|
||||
{
|
||||
display: inline-block;
|
||||
width: 180px;
|
||||
height: 280px;
|
||||
background: orangered;
|
||||
transform: rotateY(-45deg);
|
||||
-webkit-transform :rotateY(-45deg);
|
||||
-moz-transform :rotateY(-45deg);
|
||||
}
|
||||
|
||||
.coverflow ul li:hover,
|
||||
.coverflow ul li:nth-child(1) ~ li:hover /* element survole */
|
||||
{
|
||||
display: inline-block;
|
||||
width: 220px;
|
||||
height: 320px;
|
||||
background: black;
|
||||
transform: rotateY(0deg) scale(1.2);
|
||||
-webkit-transform: rotateY(0deg) scale(1.2);
|
||||
-moz-transform: rotateY(0deg) scale(1.2);
|
||||
|
||||
z-index: 60;
|
||||
}
|
||||
|
||||
.coverflow ul li:hover ~ li
|
||||
{
|
||||
transform: rotateY(-45deg);
|
||||
-webkit-transform :rotateY(-45deg);
|
||||
-moz-transform :rotateY(-45deg);
|
||||
}
|
||||
|
||||
/* les elements non survoles, lors du survol du parent */
|
||||
.coverflow ul:hover li:not(:hover){
|
||||
transform: rotateY(45deg);
|
||||
-moz-transform: rotateY(45deg);
|
||||
-webkit-transform: rotateY(45deg);
|
||||
}
|
||||
|
||||
/* les elements qui suivent l'element survole */
|
||||
.coverflow ul:hover li:hover ~ li{
|
||||
transform: rotateY(-45deg);
|
||||
-moz-transform: rotateY(-45deg);
|
||||
-webkit-transform: rotateY(-45deg);
|
||||
}
|
Reference in New Issue
Block a user