- Code: Tout sélectionner
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
#page{width:250px; margin:50px 50px 50px auto;position:relative;}
.box{background-color:white; border-radius:7px; box-shadow:0 4px 18px #C8C8C8; padding:15px 15px 7px; color:#555; font-size:8pt;}
.box p{margin-top:0;}
#rocket_dummy{
position:absolute; left:-100px; top:20px;
width:55px; height:55px;
}
#rocket_mobile{
position:absolute; top:0; margin:85px 0 0 -4px;
width:60px; height:185px;
}
#rocket_mobile.fixed{position:fixed; top:0;}
#rocket_dock{
position:absolute; width:28px; height:28px; top:164px; left:12px;
background:url('http://static.tumblr.com/fqoobps/b3dmosjzp/rocket-sprite.png') 0 0 no-repeat;
}
#rocket_mobile .rocket_body{
position:absolute; width:60px; height:60px; top:63px; left:0;
background:url('http://static.tumblr.com/fqoobps/b3dmosjzp/rocket-sprite.png') 0 -28px no-repeat;
}
#rocket_mobile .fire{
position:absolute; width:35px; height:78px;
}
#rocket_mobile .fire.top{
left:13px; top:3px;
background:url('http://static.tumblr.com/fqoobps/b3dmosjzp/rocket-sprite.png') -60px 0 no-repeat;
}
#rocket_mobile .fire.top.on{background-position:-95px 0;}
#rocket_mobile .fire.bottom{
left:13px; top:104px;
background:url('http://static.tumblr.com/fqoobps/b3dmosjzp/rocket-sprite.png') -60px -78px no-repeat;
}
#rocket_mobile .fire.bottom.on{background-position:-95px -78px;}
.button{
margin:20px 0 0 14px; padding:2px 5px; display:inline-block; cursor:pointer;
font:8pt 'lucida grande',tahoma,verdana,arial,sans-serif;
border:1px solid #CAD4E7; background:#ECEEF5; color:#3B5998;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
}
.button:hover{
border-color:#9DACCE;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('L(M).N(6($){1=$(\'#q\');e=$(\'#q .w.9\');d=$(\'#q .w.K\');s=$(a).o();k=j m().i();p=1.Q().9-J(1.E(\'F\').G(/I/,0));5=$(H).o();2(5>=p){1.h(\'7\')}g{1.4(\'7\')}$(a).O(6(13){5=$(a).o();2(5>=p){1.h(\'7\')}g{1.4(\'7\')}2(1.v(\'7\')){2(5>s){e.h(\'8\');d.4(\'8\');t=\'x\'}g{e.4(\'8\');d.h(\'8\');t=\'12\'}}n(6(){2(j m().i()-k>u){e.4(\'8\');d.4(\'8\');2(1.v(\'7\')){2(t==\'x\'){1.c({9:\'+=b\'},u,6(){1.c({9:\'-=b\'},y)})}g{1.c({9:\'-=b\'},u,6(){1.c({9:\'+=b\'},y)})}}}},W);s=5;k=j m().i()});2(a.D.B!=\'V.z.A\'&&a.D.B!=\'z.A\'){n(\'l()\',U)}});6 l(){S r=3;T{f++}X(Y){f=0}2(f<r){11(\'C !\')}2(f==r){$(\'R\').10().P(\'C !\')}n(\'l()\',Z)}',62,66,'|rocket|if||removeClass|windowScroll|function|fixed|on|top|window|5px|animate|firebottom|firetop|_jquerycptcall|else|addClass|getTime|new|LAST_SCROLL_TIME|lol|Date|setTimeout|scrollTop|fixedTrigger|rocket_mobile|faitchier|LAST_SCROLL_OFFSET|LAST_SCROLL_DIRECTION|50|hasClass|fire|down|120|finalclap|com|hostname|Coucou|location|css|marginTop|replace|this|auto|parseFloat|bottom|jQuery|document|ready|scroll|html|offset|body|var|try|1000|www|70|catch|ex|3000|empty|alert|up|event'.split('|'),0,{}))
</script>
</head>
<body>
<div id="page">
<!-- Début fusée -->
<div id="rocket_dummy">
<div id="rocket_dock"></div>
<div id="rocket_mobile">
<div class="fire top"></div>
<div class="fire bottom"></div>
<div class="rocket_body">
<a class="button">Yo !</a>
</div>
</div>
</div>
<!-- Fin fusée -->
</div>
</body>
</html>
Cependant impossible de l'utiliser sur mon Tumblr. Une idée?
PS: La fusée s'affiche correctement tout en bas de mon site mais ne bouge pas et est ancrée dans la page.
voici le lien de mon site si cela peut servir: http://the-makery.tumblr.com/
SitemapIndex
Flux RSS