Skip to content

Commit

Permalink
Fix CSS
Browse files Browse the repository at this point in the history
1. 修正排版问题
2. 修正歌单显示问题
  • Loading branch information
webjyh committed Jan 29, 2015
1 parent a1f3579 commit efecd12
Show file tree
Hide file tree
Showing 7 changed files with 42 additions and 34 deletions.
8 changes: 7 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
WP-Player V2.4.1
WP-Player V2.4.2
=========

WP-Player 一个迷你歌曲播放器,支持多歌曲播放,支持使用虾米歌曲地址,也支持自定义上传音乐。
Expand All @@ -9,6 +9,12 @@ WP-Player 一个迷你歌曲播放器,支持多歌曲播放,支持使用虾
### 声明
本插件仅供个人学习研究使用,请勿作为各种商业用户,音乐版权归网易云音乐 music.163.com 和虾米音乐 www.xiami.com 所有。

### Update Ver 2.4.2 (2015-01-29)
1. 修正因某些主题使用字体图标导致样式错位
2. 修正某些主题下歌单不显示的问题
3. 修正若干样式排版问题
4. 下个版本将会入手自定义上传多歌曲功能

### Update Ver 2.4.1 (2015-01-13)
1. 解决因关闭歌词功能导致的JS错误。
2. 修正移动端最小宽度问题。
Expand Down
4 changes: 2 additions & 2 deletions css/wp-player-plugin.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@
* @desc WP-Player MetaBox 样式
* @author M.J
* @date 2014-12-19
* @update 2015-01-13
* @update 2015-01-29
* @URL http://webjyh.com
* @version 2.4.1
* @version 2.4.2
*/
.wp-player-wrap { padding: 10px; }
.wp-player-wrap .wp-player-tabs { margin: 0px; border-bottom: 1px solid #EEE; height: 36px; }
Expand Down
52 changes: 27 additions & 25 deletions css/wp-player.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@
* @desc WP-Player 样式表
* @author M.J
* @date 2014-12-21
* @update 2015-01-13
* @update 2015-01-29
* @URL http://webjyh.com
* @Github https://github.com/webjyh/WP-Player
* @version 2.4.1
* @version 2.4.2
*
*/
.wp-player { overflow: hidden; background: #FFF; width: 350px; min-width: 300px; margin: 10px auto; border: 1px solid #DDD; box-shadow: 0px 0px 10px rgba(0,0,0, 0.15); box-sizing: content-box; }
Expand All @@ -21,41 +21,50 @@
.wp-player .wp-player-play-current,
.wp-player .wp-player-list-btn,
.wp-player .wp-player-lyrics-btn,
.wp-player .wp-player-controls a { background: url(../images/wp_player_bg.png?ver=2.4.1) no-repeat -9999px -9999px; _background: url(../images/wp_player_bg_8.png?ver=2.4.1) no-repeat -9999px -9999px; }
.wp-player .wp-player-controls a { background: url(../images/wp_player_bg.png?ver=2.4.2) no-repeat -9999px -9999px !important; _background: url(../images/wp_player_bg_8.png?ver=2.4.2) no-repeat -9999px -9999px !important; }

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max-moz-device-pixel-ratio: 2) {
.wp-player .wp-player-play-current,
.wp-player .wp-player-list-btn,
.wp-player .wp-player-lyrics-btn,
.wp-player .wp-player-controls a { background-image: url(../images/wp_player_bg2x.png?ver=2.4.2) !important; background-size: 58px auto !important; }
}

/* wp-player-play */
.wp-player .wp-player-box { height: 90px; user-select: none; }
.wp-player .wp-player-thumb { position: relative; float: left; width: 90px; height: 90px; overflow: hidden; }
.wp-player .wp-player-thumb img { padding: 0 !important; margin: 0!important; border-radius: 0!important; box-shadow: none!important; border: 0!important; display: block; width: 90px; height: 90px; vertical-align: top; }
.wp-player .wp-player-playing { display: none; position: absolute; z-index: 2; top: 0; left: 0; width: 90px; height: 90px; background: #000; background: rgba(0, 0, 0, 0.4); filter: alpha(opacity=40); }
.wp-player .wp-player-playing span { display: block; position: absolute; top: 50%; left: 50%; margin: -5px 0px 0px -5px; z-index: 3; width: 11px; height: 11px; background: url(../images/playing.gif) no-repeat; }
.wp-player .wp-player-playing span { display: block; position: absolute; top: 50%; left: 50%; margin: -5px 0px 0px -5px; z-index: 3; width: 11px; height: 11px; background: url(../images/playing.gif) no-repeat !important; }
.wp-player .wp-player-panel { margin-left: 100px; padding-top: 0px; padding-right: 10px; }
.wp-player .wp-player-title { font-size: 14px; height: 24px; line-height: 24px; color: #555; }
.wp-player .wp-player-author { line-height: 1.4; color: #999; margin-bottom: 5px; }
.wp-player .wp-player-progress { height: 4px; margin-bottom: 7px; background: #e7e9eb; border-radius: 5px; }
.wp-player .wp-player-seek-bar { width: 0; height: 100%; background: #DDD; cursor: pointer; border-radius: 5px; }
.wp-player .wp-player-play-bar { position:relative; width: 0; height: 100%; background: #00cacf; border-radius: 5px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.wp-player .wp-player-play-current { display: block; position: absolute; top: -3px; right: -5px; width: 10px; height: 10px; background-position: 0px -57px }
.wp-player .wp-player-play-current { display: block; position: absolute; top: -3px; right: -5px; width: 10px; height: 10px; background-position: 0px -57px !important; }
.wp-player .wp-player-controls-holder { position: relative; height: 28px; overflow: hidden; }
.wp-player .wp-player-time { position: absolute; top: 0px; left: 0px; width: 45px; height: 28px; line-height: 28px; color: #9a9a9a; text-align: center; }
.wp-player .wp-player-lyrics-btn { cursor: pointer; position: absolute; top: 9px; right: 25px; width: 14px; height: 14px; background-position: -20px -56px; }
.wp-player .wp-player-list-btn { cursor: pointer; position: absolute; top: 10px; right: 0px; width: 18px; height: 10px; background-position: -40px -57px }
.wp-player .wp-player-lyrics-btn { cursor: pointer; position: absolute; top: 9px; right: 25px; width: 14px; height: 14px; background-position: -20px -56px !important; }
.wp-player .wp-player-list-btn { cursor: pointer; position: absolute; top: 10px; right: 0px; width: 18px; height: 10px; background-position: -40px -57px !important; }
.wp-player .wp-player-controls { position: absolute; top: 0px; left: 50%; margin-left: -50px; width: 100px; height: 28px; }
.wp-player .wp-player-controls a { outline: 0; margin: 0; padding: 0; border: 0; text-decoration: none; position: absolute; display: block; }
.wp-player .wp-player-controls a { outline: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; text-decoration: none !important; position: absolute; display: block; }
.wp-player a.wp-player-previous,
.wp-player a.wp-player-next { top: 9px; left: 0px; width: 16px; height: 10px; background-position: 0px -6px; _background-position: 0px -4px; }
.wp-player a.wp-player-next { left: auto; right: 0px; background-position: -42px -6px; _background-position: -42px -4px; }
.wp-player a.wp-player-next { top: 9px; left: 0px; width: 16px; height: 10px; background-position: 0px -6px !important; _background-position: 0px -4px !important; }
.wp-player a.wp-player-next { left: auto; right: 0px; background-position: -42px -6px !important; _background-position: -42px -4px !important; }
.wp-player a.wp-player-play,
.wp-player a.wp-player-stop { top: 0px; left: 36px; width: 28px; height: 28px; background-position: 0px -21px; }
.wp-player a.wp-player-stop { display: none; background-position: -30px -21px; }
.wp-player a.wp-player-stop { top: 0px; left: 36px; width: 28px; height: 28px; background-position: 0px -21px !important; }
.wp-player a.wp-player-stop { display: none; background-position: -30px -21px !important; }

/* wp-player-list */
.wp-player .wp-player-main { position: relative; }
.wp-player .wp-player-list { border-top: 1px solid #DDD; -webkit-overflow-scrolling: touch; max-height: 300px; overflow: auto; }
.wp-player .wp-player-list ul { margin: 0; padding: 0; border: 0; list-style: none; }
.wp-player .wp-player-list ul li { background:#FFF; margin: 0 !important; padding: 0; border: 0 !important; cursor: pointer; list-style: none; height: 22px; line-height: 22px; padding: 4px 0px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.wp-player .wp-player-list ul li:after { content: ''; }
.wp-player .wp-player-list ul li:before { content: ''; }
.wp-player .wp-player-list ul li { list-style-type: none !important; background:#FFF; margin: 0 !important; padding: 0; border: 0 !important; cursor: pointer; list-style: none; height: 22px; line-height: 22px; padding: 4px 0px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.wp-player .wp-player-list ul li:after,
.wp-player .wp-player-list ul li:hover:after { content: '' !important; font-family: "Microsoft Yahei" !important; margin: 0px !important; }
.wp-player .wp-player-list ul li:before,
.wp-player .wp-player-list ul li:hover:before { content: '' !important; font-family: "Microsoft Yahei" !important; margin: 0px !important; }
.wp-player .wp-player-list ul li a { outline: 0!important; border: 0; background:none !important; height: 22px; overflow: hidden; line-height: 22px; padding: 0px 10px; display: block; *zoom: 1; color: #333; border-left: 4px solid #FFF; text-decoration: none; }
.wp-player .wp-player-list ul li.odd { line-height: 22px; background: #f7f7f7; }
.wp-player .wp-player-list ul li.odd a { line-height: 22px; border-color: #f7f7f7; }
Expand All @@ -70,9 +79,9 @@
/* wp-player-lyrics */
.wp-player .wp-player-lyrics { border-top: 1px solid #DDD; max-height: 300px; overflow: hidden; }
.wp-player .wp-player-lyrics ul { display: none; margin: 0; padding: 0; border: 0; list-style: none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s; transition: all 0.3s linear; }
.wp-player .wp-player-lyrics ul li { background: #FFF; margin: 0 !important; line-height: 1.5 !important; border: 0 !important; padding: 5px 10px !important; color: #666; font-size: 12px; text-align: center; list-style: none; -webkit-transition: color 0.5s linear; transition: color 0.5s linear; height: 17px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.wp-player .wp-player-lyrics ul li:after { content: ''; }
.wp-player .wp-player-lyrics ul li:before { content: ''; }
.wp-player .wp-player-lyrics ul li { list-style-type: none !important; background: #FFF; margin: 0 !important; line-height: 1.5 !important; border: 0 !important; padding: 5px 10px !important; color: #666; font-size: 12px; text-align: center; -webkit-transition: color 0.5s linear; transition: color 0.5s linear; height: 17px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.wp-player .wp-player-lyrics ul li:after { content: '' !important; font-family: "Microsoft Yahei" !important; margin: 0px !important;}
.wp-player .wp-player-lyrics ul li:before { content: '' !important; font-family: "Microsoft Yahei" !important; margin: 0px !important; }
.wp-player .wp-player-lyrics ul li.current { font-size: 14px; color: #00cacf; }

/* @media */
Expand All @@ -87,11 +96,4 @@
.wp-player .wp-player-list-title { line-height: 26px; }
.wp-player-lyrics-btn,
.wp-player-lyrics ul { display: none; }
}

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max-moz-device-pixel-ratio: 2) {
.wp-player .wp-player-play-current,
.wp-player .wp-player-list-btn,
.wp-player .wp-player-lyrics-btn,
.wp-player .wp-player-controls a { background-image: url(../images/wp_player_bg2x.png?ver=2.4.1); background-size: 58px auto; }
}
2 changes: 1 addition & 1 deletion include/player.php
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
*/
if ( !class_exists( 'wp_player_plugin' ) ){

$WP_PLAYER_VERSION = '2.4.1';
$WP_PLAYER_VERSION = '2.4.2';

class wp_player_plugin {

Expand Down
4 changes: 2 additions & 2 deletions js/plugin-uploader.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@
* @depend jQuery
* @author M.J
* @date 2014-12-19
* @update 2015-01-13
* @update 2015-01-29
* @URL http://webjyh.com
* @version 2.4.1
* @version 2.4.2
*
*/
jQuery(document).ready(function() {
Expand Down
4 changes: 2 additions & 2 deletions js/wp-player.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,11 @@
* @depend jQuery, SoundManager2
* @author M.J
* @date 2014-12-21
* @update 2015-01-13
* @update 2015-01-29
* @URL http://webjyh.com
* @Github https://github.com/webjyh/WP-Player
* @reutn {jQuery}
* @version 2.4.1
* @version 2.4.2
*
*/
~function($, soundManager) {
Expand Down
2 changes: 1 addition & 1 deletion wp-player.php
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* Plugin Name: WP-Player
* Plugin URI: http://webjyh.com/wp-player/
* Description: 一个迷你歌曲播放器,支持多歌曲播放,支持使用虾米歌曲或网易云音乐歌曲地址,也支持自定义上传音乐。
* Version: 2.4.1
* Version: 2.4.2
* Author: M.J
* Author URI: http://webjyh.com
* License: GPLv2 or later
Expand Down

0 comments on commit efecd12

Please sign in to comment.