Test Code
Webside
Visiteurs depuis le
06/12/2020 :
> 10973 <Connectés :
> 1 <Record de connectés :
> 36 <
Visiteurs aujourd'hui :
> 23 <
Pages vues depuis le début
> 48992 <
Pages vues aujourd'hui :
> 134 <
Pranx Hacker
Sound
Accessory
Alphabet
Ange/Fée
Bboguri
Cuisine
Disney
Enfants
Fleurs
Floaties
Halloween
Hello Kitty
Noël
Messages
Pâques
Paysages
Personnes
Stickers
Separation
Small/micro
Small Dolls
Zodiac
Digimon
Intarsia
Lackadaisy
Laurie
Okini Japan
Words
<p> </p> <p><span id="caret"> </span></p> <table width="100%"> <tbody> <tr> <td align="CENTER"> <div class="caroussel_diapo"> <style><!-- *{box-sizing: border-box} img{max-width:100%} .caroussel_diapo input{position:absolute;left:-9999px} .caroussel_diapo{ position:relative; align:center; margin:0 auto } .contenu_carou { width:500px; height:332px; perspective:4000px} .caroussel{ transform-style:preserve-3d; position:relative; width:500px; height:332px; transition:1s } .caroussel img { position: absolute; top:0; left: 0; outline:1px solid transparent; backface-visibility:hidden; transition:1s } .caroussel img{filter:blur(3px);opacity:.8} .caroussel img:nth-child(1){transform:translate3d(0,0,540px) scale(.8)} .caroussel img:nth-child(2){transform:rotateY(45deg) translateZ(540px) scale(.8)} .caroussel img:nth-child(3){transform:rotateY(90deg) translateZ(540px) scale(.8)} .caroussel img:nth-child(4){transform:rotateY(135deg) translateZ(540px) scale(.8)} .caroussel img:nth-child(5){transform:rotateY(180deg) translateZ(540px) scale(.8)} .caroussel img:nth-child(6){transform:rotateY(225deg) translateZ(540px) scale(.8)} .caroussel img:nth-child(7){transform:rotateY(270deg) translateZ(540px) scale(.8)} .caroussel img:nth-child(8){transform:rotateY(315deg) translateZ(540px) scale(.8)} .caroussel_diapo input[type=radio] + label { cursor:pointer; background:hsl(147,77%,81%); display:inline-block; width:20px; border-radius:50%; height:20px } .caroussel_diapo input[type=radio]:checked + label{background:hsl(147,77%,61%)} .caroussel_diapo label{background:hsl(147,77%,61%)} .caroussel_diapo input[name="rotation"]:checked ~ .contenu_carou .caroussel img:nth-child(n){ filter:drop-shadow(0px 0px 15px hsla(0,0%,0%,.5)) } .caroussel_diapo #carou_un:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px)} .caroussel_diapo #carou_deux:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-45deg)} .caroussel_diapo #carou_trois:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-90deg)} .caroussel_diapo #carou_quatre:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-135deg)} .caroussel_diapo #carou_cinq:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-180deg)} .caroussel_diapo #carou_six:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-225deg)} .caroussel_diapo #carou_sept:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-270deg)} .caroussel_diapo #carou_huit:checked ~ .contenu_carou .caroussel{transform:translateZ(-540px) rotateY(-315deg)} .caroussel_diapo #carou_un:checked ~ .contenu_carou .caroussel img:nth-child(1){transform:translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_deux:checked ~ .contenu_carou .caroussel img:nth-child(2){transform:rotateY(45deg) translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_trois:checked ~ .contenu_carou .caroussel img:nth-child(3){transform:rotateY(90deg) translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_quatre:checked ~ .contenu_carou .caroussel img:nth-child(4){transform:rotateY(135deg) translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_cinq:checked ~ .contenu_carou .caroussel img:nth-child(5){transform:rotateY(180deg) translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_six:checked ~ .contenu_carou .caroussel img:nth-child(6){transform:rotateY(225deg) translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_sept:checked ~ .contenu_carou .caroussel img:nth-child(7){transform:rotateY(270deg) translateZ(540px) scale(1);opacity:1} .caroussel_diapo #carou_huit:checked ~ .contenu_carou .caroussel img:nth-child(8){transform:rotateY(315deg) translateZ(540px) scale(1);opacity:1} > --></style> <div class="caroussel_diapo"><input id="carou_un" checked="checked" name="rotation" type="radio" /> <label for="carou_un"></label> <input id="carou_deux" name="rotation" type="radio" /> <label for="carou_deux"></label> <input id="carou_trois" name="rotation" type="radio" /> <label for="carou_trois"></label> <input id="carou_quatre" name="rotation" type="radio" /> <label for="carou_quatre"></label> <input id="carou_cinq" name="rotation" type="radio" /> <label for="carou_cinq"></label> <input id="carou_six" name="rotation" type="radio" /> <label for="carou_six"></label> <input id="carou_sept" name="rotation" type="radio" /> <label for="carou_sept"></label> <input id="carou_huit" name="rotation" type="radio" /> <label for="carou_huit"></label> <div class="contenu_carou"> <div class="caroussel"><img src="http://ekladata.com/mGDRSryJNboijYFIFpLNAFR-wMg.jpg" alt="Buns 01" /> <img src="http://ekladata.com/oAYQO-PIH5WF24gKgMzrpnBA5DM.jpg" alt="Buns 02" /> <img src="http://ekladata.com/bjKBFzQUr0vgFwROg_ZXh1Xl-2A.jpg" alt="Buns 03" /> <img src="http://ekladata.com/CO2bRTOAWLtz9Catas8evK_GOPU.jpg" alt="Buns 04" /> <img src="http://ekladata.com/F9Mg1FmOCYg4eh3efZQGJ7IyT-Q.jpg" alt="Buns 05" /> <img src="http://ekladata.com/XHn18V53KPecx3QsOnoD605OS-4.jpg" alt="Buns 06" /> <img src="http://ekladata.com/dHLPv-j2sbgdnUwnh7jT1Zyql0Q.jpg" alt="Buns 07" /> <img src="http://ekladata.com/6sFGLsOQJ_a9Fcm88PrO7jermfw.jpg" alt="Buns 08" /></div> </div> </div> </div> </td> </tr> </tbody> </table>
Connexion :