с анимацией
без анимации
Я хочу создать это пожалуйста, помогите мне.[l]Добавлено (05.09.2013, 05:55)
---------------------------------------------
Добавлено (05.09.2013, 08:04)
---------------------------------------------
HTML
Код
<div class="music-player"><div class="player"><a class="button play" href="#" onclick="musicplay();return false;"></a><div class="progressbar"><div class="preloaded"><div class="progress"></div></div></div><div class="title">01. Я иду по дороге земной</div></div><div class="playlist"></div></div>
CSS
Код
.music-player {
display:none;
position:relative;
float:right;
height:50px;
width:250px;
}
.button.play {
background:url('/images/music/player-sprite.png') #444 0 -28px no-repeat;
}
.button.play:hover {
background:url('/images/music/player-sprite.png') #1f91b6 0 -28px no-repeat;
}
.button.pause {
background:url('/images/music/player-sprite.png') #444 0 0 no-repeat;
}
.button.pause:hover {
background:url('/images/music/player-sprite.png') #1f91b6 0 0 no-repeat;
}
.button {
display:block;
top:11px;
position:relative;
width:28px;
height:28px;
border-radius:28px;
}
.progressbar {
top:6px;
float:right;
position:relative;
height:4px;
border-radius:2px;
width:220px;
background:#444;
overflow:hidden;
}
.preloaded {
width:75%;
height:4px;
background: #37b7e0;
}
.preloaded .progress {
width:34%;
height:4px;
background: #1f91b6;
}
.player .title {
color:#444;
top:16px;
left:32px;
position:absolute;
}
Добавлено (13.09.2013, 04:29)
---------------------------------------------
Кто поможет?
