You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
6.9 KiB
79 lines
6.9 KiB
@font-face{font-family:aplayer-fontello;src:url(font/aplayer-fontello.eot?72550380); |
|
src:url(font/aplayer-fontello.eot?72550380#iefix) |
|
format("embedded-opentype"), |
|
url(font/aplayer-fontello.woff?72550380) |
|
format("woff"),url(font/aplayer-fontello.ttf?72550380) |
|
format("truetype"),url(font/aplayer-fontello.svg?72550380#fontello) |
|
format("svg"); |
|
font-weight:400;font-style:normal} |
|
.aplayer-narrow{width:66px} |
|
.aplayer-narrow .aplayer-info{display:none} |
|
.aplayer-withlrc.aplayer-narrow{width:106px} |
|
.aplayer-withlrc.aplayer |
|
.aplayer-pic{height:106px;width:106px} |
|
aplayer-withlrc.aplayer .aplayer-info{margin-left:106px;height:106px} |
|
.aplayer-withlrc.aplayer .aplayer-lrc{display:block} |
|
.aplayer{ |
|
font-family: Arial,Helvetica,sans-serif; |
|
margin: 5px; |
|
-webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12); |
|
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12); |
|
-webkit-border-radius: 2px; |
|
border-radius: 10px; |
|
overflow: hidden; |
|
-webkit-user-select: none; |
|
-moz-user-select: none; |
|
-ms-user-select: none; |
|
user-select: none; |
|
background-color: #FBFBFB; |
|
} |
|
.aplayer [class*=" aplayer-icon-"]:before, |
|
.aplayer [class^=aplayer-icon-]:before{font-family:aplayer-fontello;font-style:normal;font-weight:400;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em} |
|
.aplayer .aplayer-lrc-content,.aplayer .aplayer-pic .aplayer-hide{display:none} |
|
.aplayer .aplayer-icon-weibo:before{content:'\e805'} |
|
.aplayer .aplayer-icon-play:before{content:'\e806'} |
|
.aplayer .aplayer-icon-pause:before{content:'\e807'} |
|
.aplayer .aplayer-icon-to-start:before{content:'\e808'} |
|
.aplayer .aplayer-icon-to-end:before{content:'\e809'} |
|
.aplayer .aplayer-icon-list:before{content:'\e80a'} |
|
.aplayer .aplayer-icon-menu:before{content:'\e80b'} |
|
.aplayer .aplayer-icon-volume-off:before{content:'\e800'} |
|
.aplayer .aplayer-icon-volume-down:before{content:'\e801'} |
|
.aplayer .aplayer-icon-volume-up:before{content:'\e802'} |
|
.aplayer span{cursor:default!important} |
|
.aplayer .aplayer-pic{position:relative;float:left;height:66px;width:66px} |
|
.aplayer .aplayer-pic img{ |
|
height: 100%; |
|
width: 100%; |
|
border-radius: 10px 0px 0px 10px; |
|
} |
|
.aplayer .aplayer-pic .aplayer-button{position:absolute;color:#fff;-webkit-border-radius:50%;border-radius:50%;opacity:.8;cursor:pointer;text-shadow:0 1px 1px rgba(0,0,0,.2);-webkit-box-shadow:0 1px 1px rgba(0,0,0,.2);box-shadow:0 1px 1px rgba(0,0,0,.2);background:rgba(0,0,0,.2)} |
|
.aplayer .aplayer-pic .aplayer-button:hover{opacity:1} |
|
.aplayer .aplayer-pic .aplayer-play{width:26px;height:26px;border:2px solid #fff;top:50%;left:50%;margin:-15px 0 0 -15px} |
|
.aplayer .aplayer-pic .aplayer-play .aplayer-icon-play{position:absolute;top:2px;left:4px;font-size:20px;line-height:23px} |
|
.aplayer .aplayer-pic .aplayer-pause{width:16px;height:16px;border:2px solid #fff;bottom:4px;right:4px} |
|
.aplayer .aplayer-pic .aplayer-pause .aplayer-icon-pause{position:absolute;top:1px;left:2px;font-size:12px;line-height:14px} |
|
.aplayer .aplayer-info{margin-left:106px;padding:14px 7px 0 10px;height:66px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} |
|
.aplayer .aplayer-info .aplayer-music{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:17px} |
|
.aplayer .aplayer-info .aplayer-music .aplayer-title{font-size:14px} |
|
.aplayer .aplayer-info .aplayer-music .aplayer-author{font-size:12px;color:#666} |
|
.aplayer .aplayer-info .aplayer-controller{position:relative} |
|
.aplayer .aplayer-info .aplayer-controller |
|
.aplayer-bar-wrap{margin:0 120px 0 5px} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar{position:relative;height:2px;width:100%;background:#cdcdcd;cursor:pointer!important} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded{position:absolute;left:0;top:0;bottom:0;background:#aaa;height:2px;-webkit-transition:all .5s ease;transition:all .5s ease}.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played{position:absolute;left:0;top:0;bottom:0;background:#b7daff;height:2px} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb{position:absolute;top:0;right:5px;margin-top:-4px;margin-right:-10px;height:8px;width:8px;border:1px solid #b7daff;-webkit-border-radius:50%;border-radius:50%;background:#fff;cursor:pointer!important} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb:hover{background:#b7daff} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-time{position:absolute;right:0;bottom:-5px;height:17px;color:#999;font-size:11px} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-time i{color:#666;font-size:15px} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap{display:inline-block;margin-left:7px;cursor:pointer!important} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap:hover .aplayer-volume-bar-wrap{display:block}.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap{display:none;position:absolute;bottom:17px;right:-5px;width:25px;height:40px;z-index:99} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar{position:absolute;bottom:0;right:10px;width:5px;height:35px;background:#aaa} |
|
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar .aplayer-volume{position:absolute;bottom:0;right:0;width:5px;background:#b7daff} |
|
.aplayer .aplayer-lrc{display:none;position:relative;height:40px;background:#fff;text-align:center;overflow:hidden;margin:-10px 0 10px} |
|
.aplayer .aplayer-lrc:after,.aplayer .aplayer-lrc:before{position:absolute;z-index:1;display:block;overflow:hidden;content:' ';width:100%} |
|
.aplayer .aplayer-lrc:before{top:0;height:10%;background:-webkit-linear-gradient(top,#fff 0,rgba(255,255,255,0) 100%);background:-webkit-gradient(linear,left top,left bottom,from(white),to(rgba(255,255,255,0)));background:linear-gradient(to bottom,#fff 0,rgba(255,255,255,0) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=0 )} |
|
.aplayer .aplayer-lrc:after{bottom:0;height:33%;background:-webkit-linear-gradient(bottom,#fff 0,rgba(255,255,255,0) 100%);background:-webkit-gradient(linear,left bottom,left top,from(white),to(rgba(255,255,255,0)));background:linear-gradient(to top,#fff 0,rgba(255,255,255,0) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0 )} |
|
.aplayer .aplayer-lrc p{font-size:12px;color:#666;line-height:20px;padding:0;margin:0;-webkit-transition:all .5s ease-out;transition:all .5s ease-out;opacity:.4} |
|
.aplayer .aplayer-lrc p.aplayer-lrc-current{opacity:1} |
|
.aplayer .aplayer-lrc .aplayer-lrc-contents{width:100%;-webkit-transition:all .5s ease-out;transition:all .5s ease-out} |