Mello
Messages : 111 Date d'inscription : 08/01/2013
| Sujet: PA iframe - onglets à revoir Jeu 24 Juil - 17:51 | |
| | |
|
Mello
Messages : 111 Date d'inscription : 08/01/2013
| Sujet: Re: PA iframe - onglets à revoir Jeu 24 Juil - 17:52 | |
| - Code:
-
<!doctype> <html> <style> /***MANQUE LE JAVASCRIPT POUR ONGLETS***/ /***pa kiss academy***/
/* .systab .tab => les onglet */ .systab .tab { cursor: help; padding:3px; opacity:0.7} /* .systab .tab:hover => les onglets survolés */ .systab .tab:hover { opacity:1;}
/* .systab .tab.selected => les onglets sélectionnés */ .systab .tab.selected{ opacity:1;}
/* .systab .contents => les conteneurs des contenus associés aux onglets */ .systab .contents {}
#ongle-pa1, #ongle-pa2{ box-shadow: 0px 0px 3px black; color:#3D3940; width:370px; height:310px; background-color: #C7C5C6; border-radius:15px; border:1px solid black; text-align:center; padding:12px; overflow:auto;}
#ongle-pa1{ float:left;}
#img-pa{ float:left; margin-right:10px;}
.date{ color:#D85A5E; font-weight:bold;}
#ongle-pa1 > div, #ongle-pa2 > div{ width:340px; height:260px; overflow:auto; text-align:justify; padding:12px;}
#staff-pa{ box-shadow: 0px 0px 3px black; margin-top:10px; background-color: #C7C5C6; border-radius:15px; border:1px solid black; width:800px; height:310px;}
.table-infob{ position:relative; z-index:24; padding:3px;} .table-infob span{ position:absolute; width:100px; height:0px; overflow:hidden; bottom:-50px; left:5px; background-color: #C7C5C6; font-size:11px; letter-spacing:-1px; font-variant:small-caps; text-align:center; opacity:0; transition : height 0.7s linear;} .table-infob:hover span{ opacity:1; height:48px; bottom: 4px;}
#top-pa{ text-align:right;}
#couronne{ border:none; position:absolute; margin-top:-20px; margin-left:-20px;}
.im-sta{ border:2px solid white;}
/***fin pa***/ </style> <body> <img src="http://img15.hostingpics.net/pics/828861welcome.png" /><div id="ongle-pa1">
<div class="systab"> <div> <span><img src="http://i79.servimg.com/u/f79/17/34/71/89/rose10.png" /></span><div><img src="http://i83.servimg.com/u/f83/13/66/42/13/ne10.png" id="img-pa"/> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu velit non ante dapibus molestie ut at massa. Morbi eu justo bibendum, sagittis est id, viverra nisl. Etiam suscipit porta erat, eget laoreet magna tempus et. Nullam feugiat enim purus, non rutrum metus hendrerit ac. Aenean quis nibh sed ante pellentesque suscipit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque in felis eleifend, fringilla odio quis, tempus quam. Mauris ut lorem nibh. In sed mauris laoreet, fermentum erat nec, interdum eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu velit non ante dapibus molestie ut at massa. Morbi eu justo bibendum, sagittis est id, viverra nisl. Etiam suscipit porta erat, eget laoreet magna tempus et. Nullam feugiat enim purus, non rutrum metus hendrerit ac. Aenean quis nibh sed ante pellentesque suscipit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque in felis eleifend, fringilla odio quis, tempus quam. Mauris ut lorem nibh. In sed mauris laoreet, fermentum erat nec, interdum eros.</div> </div> <div> <span><img src="http://i79.servimg.com/u/f79/17/34/71/89/bleu10.png" /></span> <img src="http://i83.servimg.com/u/f83/13/66/42/13/sans_t41.png" id="img-pa"/> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu velit non ante dapibus molestie ut at massa. Morbi eu justo bibendum, sagittis est id, viverra nisl. Etiam suscipit porta erat, eget laoreet magna tempus et. Nullam feugiat enim purus, non rutrum metus hendrerit ac. Aenean quis nibh sed ante pellentesque suscipit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque in felis eleifend, fringilla odio quis, tempus quam. Mauris ut lorem nibh. In sed mauris laoreet, fermentum erat nec, interdum eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu velit non ante dapibus molestie ut at massa. Morbi eu justo bibendum, sagittis est id, viverra nisl. Etiam suscipit porta erat, eget laoreet magna tempus et. Nullam feugiat enim purus, non rutrum metus hendrerit ac. Aenean quis nibh sed ante pellentesque suscipit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque in felis eleifend, fringilla odio quis, tempus quam. Mauris ut lorem nibh. In sed mauris laoreet, fermentum erat nec, interdum eros. </div> </div>
</div><div id="ongle-pa2"> <div class="systab"> <div> <span><img src="http://i79.servimg.com/u/f79/17/34/71/89/vert10.png" /></span> <marquee direction="up" scrolldelay="300"><span class="date">XX.XX</span> Blabla<br/> <span class="date">XX.XX</span> Blabla<br/> <span class="date">XX.XX</span> Blabla<br/></marquee> </div> <div> <span><img src="http://i79.servimg.com/u/f79/17/34/71/89/orange10.png" /></span> <marquee direction="up" scrolldelay="300" style="text-align:center;"> <a href="http://epicode.bbactif.com"><img src="http://img15.hostingpics.net/pics/986147logo2.png"/></a> <a href="http://epicode.bbactif.com"><img src="http://img15.hostingpics.net/pics/986147logo2.png"/></a> <a href="http://epicode.bbactif.com"><img src="http://img15.hostingpics.net/pics/986147logo2.png"/></a> <br/> <a href="http://epicode.bbactif.com"><img src="http://img15.hostingpics.net/pics/986147logo2.png"/></a> <a href="http://epicode.bbactif.com"><img src="http://img15.hostingpics.net/pics/986147logo2.png"/></a> <a href="http://epicode.bbactif.com"><img src="http://img15.hostingpics.net/pics/986147logo2.png"/></a> <br/></marquee> </div> </div> </div><div id="staff-pa"> <br/><img src="http://i83.servimg.com/u/f83/13/66/42/13/staff10.png" /> <table id="table-infob"><tr> <td><div class="table-infob"><img src="http://img4.hostingpics.net/pics/784630couro.png" id="couronne" /><a href="LIEN PROFIL"><img src="http://i83.servimg.com/u/f83/13/66/42/13/kira11.png" class="im-sta"/></a><span><img src="http://img15.hostingpics.net/pics/409876kira.png" /><br/>Fondatrice</span></div> </td>
<td><div class="table-infob"><a href="LIEN PROFIL"><img src="http://i79.servimg.com/u/f79/17/34/71/89/adan10.png" class="im-sta"/></a><span><img src="http://img15.hostingpics.net/pics/564178adan.png" /><br/>Administrateur</span></div></td>
<td><div class="table-infob"><a href="LIEN PROFIL"><img src="http://i79.servimg.com/u/f79/17/34/71/89/callie10.png" class="im-sta"/></a><span><img src="http://img15.hostingpics.net/pics/846338callie.png" /><br/>Administratrice</span></div></td>
<td><div class="table-infob"><a href="LIEN PROFIL"><img src="http://i79.servimg.com/u/f79/17/34/71/89/lee10.png" class="im-sta" /></a><span><img src="http://img15.hostingpics.net/pics/961415lee.png" /><br/>Rang</span></div></td>
<td><div class="table-infob"><a href="LIEN PROFIL"><img src="http://i79.servimg.com/u/f79/17/34/71/89/takam10.png" class="im-sta" /></a><span><img src="http://img15.hostingpics.net/pics/810311taka.png" /><br/>Rang</span></div></td>
<td><div class="table-infob"><a href="LIEN PROFIL"><img src="http://i79.servimg.com/u/f79/17/34/71/89/er10.png" class="im-sta"/></a><span><img src="http://img15.hostingpics.net/pics/574857erwan.png" /><br/>Rang</span></div></td> </tr><tr> <td><div class="table-infob"><a href="LIEN PROFIL"><img src="http://i79.servimg.com/u/f79/17/34/71/89/lu10.png" class="im-sta"/></a><span><img src="http://img15.hostingpics.net/pics/898415luna.png" /><br/>Rang</span></div></td> <td colspan="2" id="top-pa"> <a href="http://www.root-top.com/topsite/virtu4ldreaiviz/in.php?ID=3801" alt="Vote !"><img src="http://www.servimg.com/u/f78/16/29/66/30/12042914.gif" /></a> <a href="http://www.root-top.com/topsite/virtu4lgames/in.php?ID=3662" alt="Vote !"><img src="http://i78.servimg.com/u/f78/16/29/66/30/12042910.gif" /></a> <a href="http://www.root-top.com/topsite/virtu4lschool/in.php?ID=1985" alt="Vote !"><img src="http://i78.servimg.com/u/f78/16/29/66/30/12042912.gif" /></a> <a href="http://www.root-top.com/topsite/virtu4lhunt3r/in.php?ID=1973" alt="Vote !"><img src="http://www.servimg.com/u/f78/16/29/66/30/12042911.gif" /></a> <a href="http://www.root-top.com/topsite/hadesmature/in.php?ID=164" alt="Vote !"><img src="http://i83.servimg.com/u/f83/13/66/42/13/sans_t14.gif" /></a> </td> <td colspan="3"><img src="http://img4.hostingpics.net/pics/466929vote.png" /></td>
</tr> </table> </div> </body> </html> | |
|