_includes/meng/aplayer.html in jekyll-theme-mdui-0.5.2.4 vs _includes/meng/aplayer.html in jekyll-theme-mdui-0.5.3

- old
+ new

@@ -1,100 +1,100 @@ -{% assign aplayer = site.data.meng.music_player %} -<style> - @media screen and (max-width: 600px){ - .k-music-card{ - transform:translateX(-250px) - } - } - .k-music-card{ - width: 270px; - box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); - position: fixed; - bottom: 155px; - z-index: 999; - transition: transform .5s ease; - } -.aplayer{ - float: left; - width: 250px; - margin: 0 auto; - position: relative; - background: rgb(255,255,255); - box-sizing: border-box; - box-shadow: none; -} -.k-music-btn{ - text-align: center; - line-height: 66px; - color: #fff; - width: 20px; - height: 66px; - background: {{aplayer.button_color}} none repeat scroll 0% 0%; - position: relative; - right: 0px; - bottom: 0px; - box-sizing: border-box; - border-left: none; - cursor: pointer; - display: box-shadow:; - float: right; -} -</style> -<div class="k-music-card"> -<div id="player1" class="aplayer"></div> -<div class="k-music-btn">></div> -</div> - -<script src="https://cdn.bootcss.com/aplayer/1.6.0/APlayer.min.js"></script> -<script> - var ap = new APlayer({ - element: document.getElementById('player1'), - narrow: false, - autoplay: true, - showlrc: 0, - mutex: true, - theme: '#e6d0b2', - mode: 'random', - preload: 'metadata', - listmaxheight: '513px', - music:[ - {% for music in aplayer.music %} - { - title: '{{music.title}}', - author: '{{music.author}}', - url: '{{music.url}}', - pic: '{{music.pic}}', - lrc: '[00:00.00]lrc here\n[00:01.00]aplayer' - }, - {% endfor %} - ] -}); - -$(".aplayer-list").addClass("aplayer-list-hide"); -if($(window).width()<=600){ - var flag = true; -}else{ - var flag = false; -} - -$('.k-music-btn').click(function(){ - if (flag == false){ - $('.k-music-card').css('transform','translateX(-250px)'); - flag = true; - }else if(flag == true){ - $('.k-music-card').css('transform','translateX(0px)'); - flag = false; - } - - if (!$(".aplayer-list").hasClass('aplayer-list-hide')) { - $(".aplayer-list").addClass('aplayer-list-hide'); - } -}); - document.addEventListener("visibilitychange", function() { - if(document.visibilityState == "hidden" ){ - ap.pause(); - } - if(document.visibilityState == "visible"){ - ap.play(); - } - }, false); -</script> +{% assign aplayer = site.data.meng.music_player %} +<style> + @media screen and (max-width: 600px){ + .k-music-card{ + transform:translateX(-250px) + } + } + .k-music-card{ + width: 270px; + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); + position: fixed; + bottom: 155px; + z-index: 999; + transition: transform .5s ease; + } +.aplayer{ + float: left; + width: 250px; + margin: 0 auto; + position: relative; + background: rgb(255,255,255); + box-sizing: border-box; + box-shadow: none; +} +.k-music-btn{ + text-align: center; + line-height: 66px; + color: #fff; + width: 20px; + height: 66px; + background: {{aplayer.button_color}} none repeat scroll 0% 0%; + position: relative; + right: 0px; + bottom: 0px; + box-sizing: border-box; + border-left: none; + cursor: pointer; + display: box-shadow:; + float: right; +} +</style> +<div class="k-music-card"> +<div id="player1" class="aplayer"></div> +<div class="k-music-btn">></div> +</div> + +<script src="https://cdn.bootcss.com/aplayer/1.6.0/APlayer.min.js"></script> +<script> + var ap = new APlayer({ + element: document.getElementById('player1'), + narrow: false, + autoplay: true, + showlrc: 0, + mutex: true, + theme: '#e6d0b2', + mode: 'random', + preload: 'metadata', + listmaxheight: '513px', + music:[ + {% for music in aplayer.music %} + { + title: '{{music.title}}', + author: '{{music.author}}', + url: '{{music.url}}', + pic: '{{music.pic}}', + lrc: '[00:00.00]lrc here\n[00:01.00]aplayer' + }, + {% endfor %} + ] +}); + +$(".aplayer-list").addClass("aplayer-list-hide"); +if($(window).width()<=600){ + var flag = true; +}else{ + var flag = false; +} + +$('.k-music-btn').click(function(){ + if (flag == false){ + $('.k-music-card').css('transform','translateX(-250px)'); + flag = true; + }else if(flag == true){ + $('.k-music-card').css('transform','translateX(0px)'); + flag = false; + } + + if (!$(".aplayer-list").hasClass('aplayer-list-hide')) { + $(".aplayer-list").addClass('aplayer-list-hide'); + } +}); + document.addEventListener("visibilitychange", function() { + if(document.visibilityState == "hidden" ){ + ap.pause(); + } + if(document.visibilityState == "visible"){ + ap.play(); + } + }, false); +</script>