JOLCSIKANAK ÜZENET - igy csináld !  -  a kész  HTML codot  bemásolod ide:

Elösször készitsed el 7 db  800x600 képeket /de lehetnek kissebbek vagy nagyobbak is de jobb a 800x600

Ezeket a képeidet felteszed az Ekla oldalra

és a Te képeid  url kodoját kicseréled ott ahol az én képeim url- vannak bemásolva az (piros)

és a Te képeid fognak megjelenni

Ha kész a képeid bemásolása vidd el a kész kodot http://ilnalapja.gportal.hu/

Ttt az oldalon balra lennt van a KOD KIPROBÁLÁSA és nézd meg milyen lett az eredmény ott  

EZ a HTML cod : - Eredeti kodot megtalálod itt: http://pourquoipas732.eklablog.com/en-rond-p1187902

    <div id="aa">
<p id="a1">&nbsp;</p>
<p id="a2">&nbsp;</p>
<p id="a3">&nbsp;</p>
<p id="a4">&nbsp;</p>
<p id="a5">&nbsp;</p>
<p id="a6">&nbsp;</p>
<p id="a7">&nbsp;</p>
</div>

<style><!--
#aa{width:800px; height:600px; margin:5px auto;}
#a1{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/wRbmR_xiU8qx18ajdCmqOahTbxI/kepem001.jpg);
transition:all 1s linear; transform:translate(20px,20px); background-position:center center;}
#a2{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/xkzANGi_1JhuwDkbxEyzvc09D4s/kepem002.jpg);
transition:all 1s linear; transform:translate(120px,120px); background-position:center center;}
#a3{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/cQ43tKvWaA2raoMOdw9YnWW9y1g/kepem003.jpg);
transition:all 1s linear; transform:translate(270px,50px); background-position:center center;}
#a4{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/_eYizPnGboJCRh07YVbnd9F0FJE/kepem004.jpg);
transition:all 1s linear; transform:translate(420px,10px); background-position:center center;}
#a5{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/F9f12-LHMz4h61lEqG-O-LbQkaI/kepem005.jpg);
transition:all 1s linear; transform:translate(460px,180px); background-position:center center;}
#a6{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/MWfEkCoe_vY_MQOhQgGmdj2UEvQ/kepem006.jpg);
transition:all 1s linear; transform:translate(350px,250px); background-position:center center;}
#a7{position:absolute; z-index:1; width:200px; height:200px; border-radius:50%; border:3px solid white;
box-shadow:inset 4px 4px 8px white, inset -4px -4px 8px black; background:url(http://ekladata.com/c34rL6gpRn1uDtqEp8fNSriYGmM/kepem007.jpg);
transition:all 1s linear; transform:translate(160px,260px); background-position:center center;}
#a1:hover, #a2:hover, #a3:hover, #a4:hover, #a5:hover, #a6:hover, #a7:hover{z-index:10; transform:translate(0px,0px);
width:800px; height:600px; border:none; border-radius:0%;}
--></style>
 

EZ AZ EREDMÉNY !!! - Ha elakadsz irj ! ilnaeklabildkukacgmail.com  Sok sikert !