Partagez
Voir le sujet précédentAller en basVoir le sujet suivant
avatar
Mademoiselle
Admin
Messages : 69
Date d'inscription : 14/03/2017
http://milano.forumactif.com

Effet transition sur image

le Dim 23 Avr - 16:06





Code:
<style type="text/css">.miyazakip {height: 478px; width:310px; padding: 5px; overflow:auto; margin-top:-507px; margin-right:0px; position: relative; background-color: rgba(255,255,255,0); color:#66594E; text-align: justify; opacity: 0; font-size: 10px; line-height: 130%; -moz-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -o-transition-duration: 0.7s; transition-duration: 0.7s} .miyazakip:hover {height: 478px; width:310px; padding: 5px; margin-top:-507px; margin-right:0px; position: relative; background-color: rgba(255,255,255,0.9); color:#66594E; font-size : 10px; opacity: 1; -moz-transition-duration: 0.7s;  -webkit-transition-duration: 0.7s; -o-transition-duration: 0.7s; overflow:auto;} .cadlink {height: 488px; width:320px; margin-top:-503px; border:1px solid white; position: relative;} .tintlink {width:350px;text-align:center; color:white; font-size:13px; font-family: 'Open Sans Condensed', sans-serif; margin-top:-259px; margin-bottom:0px; position: relative; margin-bottom:259px;} .psintlink {height:5px; width: 230px; border: 1px solid #eee; font-size:18px; font-family: 'Open Sans Condensed', sans-serif; padding:10px; margin:15px;padding-bottom:20px;} .caclink {height:168px; width: 240px; border: 1px solid #eee; padding:5px; margin-bottom:15px;} .calink {height:168px; width: 240px; font-family: calibri; font-size: 9px; text-align: justify; line-height: 100%; letter-spacing: 1px; overflow:auto;} .coplink {font-size:7px;}</style>

<center><img src="https://s-media-cache-ak0.pinimg.com/564x/6b/95/9a/6b959a811967baaa5fa1035509bb9ad1.jpg" style="width:350px;"/><div class="cadlink"></div><div class="tintlink">TITRE QUE VOUS VOULEZ ICI</div><div class="miyazakip"><center><embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=https://a.tumblr.com/tumblr_o1umltKF1a1u32atmo1.mp3&t0=&f1=https://a.tumblr.com/tumblr_obmzqh6J1r1rgvwoco1.mp3&t1=&f2=https://a.tumblr.com/tumblr_odplb2WGR01qd9azto1.mp3&t2=&f3=https://a.tumblr.com/tumblr_nvtwwpX0hv1rgvwoco1.mp3&t3=&f4=https://a.tumblr.com/tumblr_o9xcnftlO61t8sz1po1.mp3&t4=&total=5" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" /><div class="psintlink">PRÉNOM NOM</div><div class="caclink"><div class="calink">En soit, là, vous mettez ce que vous voulez : liens recherchés, caractère, histoire, osef. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec augue nibh, egestas vitae sapien in, rutrum blandit ipsum. Curabitur ultrices in est a ornare. Nam scelerisque ligula sit amet justo dictum pretium. Pellentesque odio tortor, venenatis a vulputate vitae, viverra a eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla eleifend nisi augue, a pretium augue dictum sit amet. Suspendisse congue lorem ut rutrum dapibus. Maecenas sollicitudin suscipit turpis, vitae aliquet est lobortis id. In congue erat dolor, a scelerisque elit pharetra at. Pellentesque sed nulla ante. Fusce fringilla, massa non feugiat varius, ligula ante pulvinar sem, vitae fringilla arcu mi facilisis enim. Sed euismod commodo condimentum. Praesent sodales bibendum neque ac gravida. Nulla tempus posuere nunc, dapibus facilisis dui ullamcorper id. Nunc at lobortis magna. Cras dignissim ornare mi, sit amet tincidunt augue fringilla sit amet. Sed tristique tellus in mauris rhoncus, vel venenatis quam cursus. Suspendisse luctus rhoncus tincidunt. In ornare, augue a rutrum luctus, enim nulla porta tortor, at pharetra felis elit vitae nisl.</div></div><div class="caclink"><div class="calink">En soit, là, vous mettez ce que vous voulez : liens recherchés, caractère, histoire, osef. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec augue nibh, egestas vitae sapien in, rutrum blandit ipsum. Curabitur ultrices in est a ornare. Nam scelerisque ligula sit amet justo dictum pretium. Pellentesque odio tortor, venenatis a vulputate vitae, viverra a eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla eleifend nisi augue, a pretium augue dictum sit amet. Suspendisse congue lorem ut rutrum dapibus. Maecenas sollicitudin suscipit turpis, vitae aliquet est lobortis id. In congue erat dolor, a scelerisque elit pharetra at. Pellentesque sed nulla ante. Fusce fringilla, massa non feugiat varius, ligula ante pulvinar sem, vitae fringilla arcu mi facilisis enim. Sed euismod commodo condimentum. Praesent sodales bibendum neque ac gravida. Nulla tempus posuere nunc, dapibus facilisis dui ullamcorper id. Nunc at lobortis magna. Cras dignissim ornare mi, sit amet tincidunt augue fringilla sit amet. Sed tristique tellus in mauris rhoncus, vel venenatis quam cursus. Suspendisse luctus rhoncus tincidunt. In ornare, augue a rutrum luctus, enim nulla porta tortor, at pharetra felis elit vitae nisl.</div></div><div class="coplink">© bermudes</div></center></div></center>
Voir le sujet précédentRevenir en hautVoir le sujet suivant
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum