I updated this one because the old post is so childish. This is the minimal sliding music player version.This type of music player will appear at the bottom left of your blog.
From this:
To this:
The music player is transparent accept the mini box. Paste the codes below before </style> .
.musicbox{position:fixed;
padding:5px;
width:10px;
background-color:#f1f1f1;
border:1px #808080 solid;
z-index:999;
bottom:10px;
left:10px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
.player{
width:200px;
margin-top:-15px;
opacity:0;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
.musicbox:hover .player{After you paste the codes above, paste this codes below after <body>
margin-left:18px;
opacity:1;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
<div class=”musicbox“><img src=”http://25.media.tumblr.com/tumblr_m4cc60Ttl21r2gm7fo1_100.png”><div class=”player“> MUSIC PLAYER CODE </div></div>The blue code is the URL of the music icon. You can change it to any other icon URL that you want. The green code is for your music player code like the billy music player.If you have any problem, don't hesitate to tell me.
0 Notes
Sunday, June 3, 2012
Sunday, June 3, 2012