-
Par Ilnadesign le 17 June 2017 à 16:38
Kell hozzá 5 drb 800X600 a te képeidre tegyél rá 3px fehér keretet igy lesz 806X606px a kép nagysága
Felteszed ezeket az ek.laoldalra és a képek url kepcimét kicseréled ott ahol piros.
Itt a COD : Az eredeti kodot megtalálod itt: http://pourquoipas732.eklablog.com/pas-clip-p1181180
__________________________
<div id="cad">
<p id="rem1"> </p>
<p id="rem2"> </p>
<p id="rem3"> </p>
<p id="rem4"> </p>
</div>
<style><!--
#cad{position:relative; width:800px; height:600px; margin:10px auto; background:url(http://ekladata.com/01z5HNbhP3-VT1VDvI30yu_lsoM/kepredalap806x.jpg);
box-sizing:border-box; border:6px ridge grey;}
#rem1 {position:absolute; z-index:5; transition:all 1s linear; transform:translate(100px,100px) rotate(25deg); width:200px; height:200px;
box-sizing:border-box; border: 4px solid white; background:url(http://ekladata.com/tisWpAh6YVzE99wMfRo-TWpnovg/kepblou01.jpg); background-position: 50% 50%;}
#rem2 {position:absolute; z-index:5; transition:all 1s linear; transform:translate(50px,350px) rotate(0deg); width:200px; height:200px; border-radius:50%;
box-sizing:border-box; border: 4px solid white; background:url(http://ekladata.com/pdZBd64ByeAImd_OJaooZfreZAw/keprosa02.jpg); background-position: 62% 40%;}
#rem3 {position:absolute; z-index:5; transition:all 1s linear; transform:translate(450px,100px) rotate(-25deg); width:250px; height:200px; border-radius:50%;
box-sizing:border-box; border: 4px solid white; background:url(http://ekladata.com/aWr0ORMW8zbHwOZRZ8rFDgsxuvQ/keprosa03.jpg); background-position: 30% 40%;}
#rem4 {position:absolute; z-index:5; transition:all 1s linear; transform:translate(350px,400px) rotate(0deg); width:250px; height:150px; border-radius:0%;
box-sizing:border-box; border: 4px solid white; background:url(http://ekladata.com/B757hTvYvtqEOQQisj8beAvAC84/keprosa04.jpg); background-position: 50% 30%;}
#rem1:hover, #rem2:hover, #rem3:hover, #rem4:hover{z-index:10; width:800px; height:600px; border:0px; transform:translate(0px,0px); border-radius:0%;}
--></style>AZ EREDMÉNY :
your comment
Follow this section's article RSS flux
Follow this section's comments RSS flux