淡淡清茶 发表于 2020-10-18 16:27:24

谢谢

http://www.ii23.cn/data/attachment/album/202010/18/162030a8aa64uva64ha820.png


淡淡清茶 发表于 2020-10-18 16:32:49

麻烦给贴首
汪峰的歌曲
《谢谢》‰ °啈冨㊣恠蔓筵╪──→『周末愉快』



II.〆石Zi° 发表于 2020-10-18 18:40:22

本帖最后由 II.〆石Zi° 于 2020-10-31 23:41 编辑 <br /><br /><div style="width:0px;height: 0px;left: 400px; top: -300px; position: relative;">
<div style="left: -180px; top: -150px; position:absolute;">
<title>II23休闲社区II.〆石Zi°特制音乐播放器,歌词同步,颜色风格可调</title>
<style>
@font-face{format("svg");
      font-weight:400;font-style:normal}
      .aplayer-narrow .aplayer-info{display:none}
      .aplayer-withlrc.aplayer .aplayer-info{margin-left:0px;height:0px}
      .aplayer-withlrc.aplayer .aplayer-lrc{display:block;}
      .aplayer{
      font-family: Arial,Helvetica,sans-serif;
      margin: 0px;
      box-shadow: 0 0px 0px 0 rgba(0,0,121,.14),0 0px 0px -0px rgba(0,0,121,.2),0 0px 0px 0 rgba(0,0,121,.12);/* 边框颜色等 */
      border-radius: 10px;}/* 边框圆角 */

      .aplayer span{cursor:default!important}
      .aplayer{height:22px;width:300px; background-color: rgba(0,0,0,0.3);}/* 播放器区域的大小、颜色 、颜色中的参数a可调整透明度*/

      .aplayer :before,
      .aplayer :before{font-family:aplayer-fontello;font-style:normal;font-weight:400;display:inline-block;text-decoration:inherit;text-align:center;font-variant:normal;text-transform:none; line-height:16px; font-size: 14px; color:#ffffFF; width:17px;height:17px; border:1px solid #ffffFF; border-radius: 16px; position:absolute;bottom:2px; left:8px;} /* 按钮圈大小、颜色、位置,按钮字体大小、颜色 */

      .aplayer-lrc-content,.aplayer .aplayer-hide{display:none}
      .aplayer-icon-play:before{content:'\25b6'}
      .aplayer-icon-pause:before{content:'\2016'} /* 设置按钮键 */

      .aplayer-bar-wrap{height:1px; width:180px;background: rgba(200,0,0,0.9);position:absolute;left:32px;bottom:10px; }/* 进度条长度、位置及未播放段颜色 */
      .aplayer-bar{-webkit-transition:all .5s ease;transition:all .5s ease}
      .aplayer-played{position:absolute;left:0px;bottom:-2px; background:rgba(250,0,0,0.9);height:5px}/* 进度条已播放段颜色 */

      .aplayer-thumb:hover{background: #FFFF00;}
      .aplayer-thumb{position:absolute;top:2px;right:5px;margin-top:-3px;margin-right:-10px;height:6px;width:6px;border:1px solid rgba(250,0,0,0.9); border-radius:50%;background: rgba(250,0,0,0.9);cursor:pointer!important;}/* 进度球大小及颜色 */

      .aplayer-time{position:absolute;right:6px;bottom:3px;height:17px;color: #ffffff;font-size:10px}/* 时间 */

      .aplayer-lrc{transform:rotate(90deg);display:none;height:560px; width: 650px; position:absolute; left:-540px;top:-150px; text-align:left;overflow:hidden;margin:0px 0px 0px 120px; BACKGROUND:rgba(0,0,0,0.0);}/* 歌词区域大小,位置调整 */
      .aplayer .aplayer-lrc p{transform:rotate(-90deg);line-height:20px;font-family:楷体;font-size:5px;color: rgba(255,255,255,0);padding:0;margin:0px 0px 0px 290px;-webkit-transition:all 0s ease-in-out;transition:all 0s ease-in-out;opacity:1;} /* 歌词字体、颜色及大小,未播放歌词透明度 */
      .aplayer-lrc p.aplayer-lrc-current{ransform:rotate(-90deg);height:100%;writing-mode:vertical-rl;transform:rotate(-90deg);line-height:20px;line-width:24px;font-family:微软雅黑;font-size:30px;font-weight:bold;color: rgba(0,0,80,0.5);opacity:1;}/* 正播放歌词透明度 */
      .aplayer-lrc .aplayer-lrc-contents{height:100%;-webkit-transition:all 0s ease-in-out;transition:all 0s ease-in-out}
.demo {
    margin: 0px auto;
    align:center;

          }
.demo p {
    padding: 10px 0;
    opacity: 1;
            }


</style>

      <div class="demo">
                     <p><strong></strong></p>
      <div id="player3" class="aplayer">
                   <pre class="aplayer-lrc-content">

汪峰 - 谢谢(Live)
作词:汪峰
作曲:汪峰
编曲:汪峰
乐队总监:刘卓
键盘:刘卓、李海郡
吉他:高飞、金天
贝司:李九君
鼓手:卢炜
打击乐:刘效松
小雨纷纷的夜我回到家里
窗外是那漫天闪烁的星星
我看着远方不悲伤不仰望
蹒跚的小路上有夜莺在唱
我看到了你看到来时的路
看到那些尘封的痛哭与晃动
仿佛看到你谎言的无名指上
盛开着娇艳的鲜花
谢谢 现在我只想说谢谢你
让我拥有孤独却完整的自己
我曾经陷落在你的漩涡里
此刻那些伤
让我明白了幸福的含义
时光真甜蜜但一切已太晚
我不再等你找你满脑都是你
可当我在街角的杂货店看到你
不自觉地泪水却依然夺眶而出
谢谢 此刻我只想说谢谢你
给我如此悲伤却刻骨的回忆
我曾经迷失在你的黑夜里
如今那些痛
让我懂得了存在的意义
那是最后一次看到熟悉的你
你靠在另一个陌生的怀抱里
其实那一刻我真没有恨的感觉
只是突然觉得孤独得想要死去
谢谢 现在我只想说谢谢你
让我拥有寂寞却解脱的灵魂
我曾经粉碎在你的风暴里
此刻那些伤
让我明白了幸福的意义
哦 谢谢 此刻我只想说谢谢你
给我如此悲伤却刻骨的回忆
我曾经迷失在你的黑夜里
如今那些痛
让我懂得了存在的意义
如今那些痛
让我懂得了存在的意义
——End——
--------------
         </pre>
      </div>
      </div>


<script>
function APlayer(e)
{if(!("music"in e&&"title"in e.music&&"author"in e.music&&"url"in e.music&&"pic"in e.music))throw"APlayer Error: Music, music.title, music.author, music.url, music.pic are required in options";if(null===e.element)throw"APlayer Error: element option null";this.isMobile=navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i),this.isMobile&&(e.autoplay=!1);var a={element:document.getElementsByClassName("aplayer"),narrow:!1,autoplay:!1,showlrc:!1};for(var t in a)a.hasOwnProperty(t)&&!e.hasOwnProperty(t)&&(e=a);this.option=e}

APlayer.prototype.init=function(){function e(e)
{var a=e||window.event,i=(a.clientX-t(m.bar))/p;i=i>0?i:0,i=1>i?i:1,m.updateBar.call(m,"played",i,"width"),m.option.showlrc&&m.updateLrc.call(m,parseFloat(m.playedBar.style.width)/100*m.audio.duration),m.element.getElementsByClassName("aplayer-ptime").innerHTML=m.secondToTime(i*m.audio.duration)}function a(){document.removeEventListener("mouseup",a),document.removeEventListener("mousemove",e),m.audio.currentTime=parseFloat(m.playedBar.style.width)/100*m.audio.duration,m.play()}function t(e){for(var a,t=e.offsetLeft,i=e.offsetParent;null!==i;)t+=i.offsetLeft,i=i.offsetParent;return a=document.body.scrollLeft+document.documentElement.scrollLeft,t-a}function i(e){for(var a,t=e.offsetTop,i=e.offsetParent;null!==i;)t+=i.offsetTop,i=i.offsetParent;return a=document.body.scrollTop+document.documentElement.scrollTop,t-a}

if(this.element=this.option.element,this.music=this.option.music,this.option.showlrc)
{this.lrcTime=[],this.lrcLine=[];for(var l=this.element.getElementsByClassName("aplayer-lrc-content").innerHTML,s=l.split(/\n/),n=/\[(\d{2}):(\d{2})\.(\d{2})]/,r=/](.*)$/,o=0;o<s.length;o++)
{var d=n.exec(s),c=r.exec(s);d&&c&&(this.lrcTime.push(60*parseInt(d)+parseInt(d)+parseInt(d)/100),this.lrcLine.push(c))}}

if(this.element.innerHTML='<div class="aplayer-pic"><img src="'+this.music.pic+'"><div class="aplayer-button aplayer-pause aplayer-hide"><i class="demo-icon aplayer-icon-pause"></i></div><div class="aplayer-button aplayer-play"><i class="demo-icon aplayer-icon-play"></i></div></div><div class="aplayer-info"><div class="aplayer-music"><span class="aplayer-title">'+this.music.title+'</span><span class="aplayer-author">努力加载中,好累啊</span></div><div class="aplayer-lrc"><div class="aplayer-lrc-contents" style="transform: translateY(0);"></div></div><div class="aplayer-controller"><div class="aplayer-bar-wrap"><div class="aplayer-bar"><div class="aplayer-loaded" style="width: 0"></div><div class="aplayer-played" style="width: 0"><span class="aplayer-thumb"></span></div></div></div><div class="aplayer-time"><span class="aplayer-ptime">00:00</span> / <span class="aplayer-dtime">(o゚▽゚)</span><div class="aplayer-volume-wrap"><i class="demo-icon aplayer-icon-volume-down"></i><div class="aplayer-volume-bar-wrap"><div class="aplayer-volume-bar"><div class="aplayer-volume" style="height: 80%"></div></div></div></div></div></div></div>',this.option.showlrc){this.element.classList.add("aplayer-withlrc");var u="";for(this.lrcContents=this.element.getElementsByClassName("aplayer-lrc-contents"),o=0;o<this.lrcLine.length;o++)u+="<p>"+this.lrcLine+"</p>";this.lrcContents.innerHTML=u,this.lrcIndex=0,this.lrcContents.getElementsByTagName("p").classList.add("aplayer-lrc-current")}this.option.narrow&&this.element.classList.add("aplayer-narrow"),this.audio=document.createElement("audio"),this.audio.src=this.music.url,this.audio.loop=!0,this.audio.preload="metadata";var m=this;this.audio.addEventListener("durationchange",function(){1!==m.audio.duration&&(m.element.getElementsByClassName("aplayer-dtime").innerHTML=m.secondToTime(m.audio.duration))}),this.audio.addEventListener("loadedmetadata",function(){m.element.getElementsByClassName("aplayer-author").innerHTML=m.music.author,m.loadedTime=setInterval(function(){var e=m.audio.buffered.end(m.audio.buffered.length-1)/m.audio.duration;m.updateBar.call(m,"loaded",e,"width"),1===e&&clearInterval(m.loadedTime)},500)}),this.audio.addEventListener("error",function(){m.element.getElementsByClassName("aplayer-author").innerHTML="歌曲链接失效"}),this.playButton=this.element.getElementsByClassName("aplayer-play"),this.pauseButton=this.element.getElementsByClassName("aplayer-pause"),this.playButton.addEventListener("click",function(){m.play.call(m)}),this.pauseButton.addEventListener("click",function(){m.pause.call(m)}),this.playedBar=this.element.getElementsByClassName("aplayer-played"),this.loadedBar=this.element.getElementsByClassName("aplayer-loaded"),this.thumb=this.element.getElementsByClassName("aplayer-thumb"),this.bar=this.element.getElementsByClassName("aplayer-bar");var p;this.bar.addEventListener("click",function(e){var a=e||window.event;p=m.bar.clientWidth;var i=(a.clientX-t(m.bar))/p;m.updateBar.call(m,"played",i,"width"),m.element.getElementsByClassName("aplayer-ptime").innerHTML=m.secondToTime(i*m.audio.duration),m.audio.currentTime=parseFloat(m.playedBar.style.width)/100*m.audio.duration}),this.thumb.addEventListener("mousedown",function(){p=m.bar.clientWidth,clearInterval(m.playedTime),document.addEventListener("mousemove",e),document.addEventListener("mouseup",a)}),this.audio.volume=.8,this.volumeBar=this.element.getElementsByClassName("aplayer-volume");var y=this.element.getElementsByClassName("aplayer-volume-bar"),h=m.element.getElementsByClassName("aplayer-time").getElementsByTagName("i"),v=35;this.element.getElementsByClassName("aplayer-volume-bar-wrap").addEventListener("click",function(e){var a=e||window.event,t=(v-a.clientY+i(y))/v;t=t>0?t:0,t=1>t?t:1,m.updateBar.call(m,"volume",t,"height"),m.audio.volume=t,m.audio.muted&&(m.audio.muted=!1),1===t?h.className="demo-icon aplayer-icon-volume-up":h.className="demo-icon aplayer-icon-volume-down"}),h.addEventListener("click",function(){m.audio.muted?(m.audio.muted=!1,h.className=1===m.audio.volume?"demo-icon aplayer-icon-volume-up":"demo-icon aplayer-icon-volume-down",m.updateBar.call(m,"volume",m.audio.volume,"height")):(m.audio.muted=!0,h.className="demo-icon aplayer-icon-volume-off",m.updateBar.call(m,"volume",0,"height"))}),this.option.autoplay&&this.play()},APlayer.prototype.play=function(){this.playButton.classList.add("aplayer-hide"),this.pauseButton.classList.remove("aplayer-hide"),this.audio.play();var e=this;this.playedTime=setInterval(function(){e.updateBar.call(e,"played",e.audio.currentTime/e.audio.duration,"width"),e.option.showlrc&&e.updateLrc.call(e),e.element.getElementsByClassName("aplayer-ptime").innerHTML=e.secondToTime(e.audio.currentTime)},100)},APlayer.prototype.pause=function(){this.pauseButton.classList.add("aplayer-hide"),this.playButton.classList.remove("aplayer-hide"),this.audio.pause(),clearInterval(this.playedTime)},APlayer.prototype.updateBar=function(e,a,t){a=a>0?a:0,a=1>a?a:1,this.style=100*a+"%"},APlayer.prototype.updateLrc=function(e){if(e||(e=this.audio.currentTime),e<this.lrcTime||e>=this.lrcTime)for(var a=0;a<this.lrcTime.length;a++)e>=this.lrcTime&&(!this.lrcTime||e<this.lrcTime)&&(this.lrcIndex=a,this.lrcContents.style.transform="translateY("+20*-this.lrcIndex+"px)",this.lrcContents.getElementsByClassName("aplayer-lrc-current").classList.remove("aplayer-lrc-current"),this.lrcContents.getElementsByTagName("p").classList.add("aplayer-lrc-current"))},APlayer.prototype.secondToTime=function(e){var a=function(e){return 10>e?"0"+e:""+e},t=parseInt(e/60),i=parseInt(e-60*t);return a(t)+":"+a(i)};
</script>
<script>
        var ap3 = new APlayer({
                element: document.getElementById('player3'),//样式1
                narrow: false,
                autoplay: true,
                showlrc: true,
                music: {
                        title: '',
                        author: '',
            url: 'https://sharefs.yun.kugou.com/202010312341/dc396cc0333e894cd9d76c1319f30909/G066/M00/15/17/4oYBAFfZAu-AdvZSAEwHWCgmx6Y298.mp3',
                        pic: ''
                }
        });
        ap3.init();
</script>

</div>
</div>
<p>开始做帖了啊</p>
<style>
.a_t{display:none!important}
.a_mu{display:none!important}

.scbar_txt_td{display:none!important}
.scbar_type_td{display:none!important}
.scbar_btn_td{display:none!important}
.scbar_hot_td{display:none!important}
//.pgs{display:none!important}

#wechat_float_qrcode{display:none!important}

.scrolltopa{display:none!important}
#scrolltop{display:none!important}
.returnlist{display:none!important}

/* .pstatus{display:none!important} */
.tshare{display:none!important}
.a_pt, .a_pb{display:none!important}

</style>

淡淡清茶 发表于 2020-10-18 22:56:50

http://www.ii23.cn/data/attachment/album/201907/31/155610hj9zbopuhpz9ou1u.gifhttp://www.ii23.cn/data/attachment/album/201905/16/220710wjusij1sn0666jur.gif谢谢石版贴的竖状跳动歌词好喜欢 不停循环唱(贴就不做了笨不怎么会做)

ll菜鸟ll 发表于 2020-10-18 23:09:15

谢谢各位兄弟姐妹.

落烟泪沫 发表于 2020-10-19 02:12:02


雪版确实是一个有责任心又热情的好版主,因为有你,版友的问题得到了解决,感谢有你。

无魂回归 发表于 2020-10-19 07:19:00

楼主是一个懂得感恩之人

陌花雨 发表于 2020-10-19 07:48:54

只因在这感受到家的温暖,一直没有离去。

片片枫叶情 发表于 2020-10-19 07:49:41

我们是一个团结的家庭。

彩虹密码 发表于 2020-10-19 08:57:37

本帖最后由 彩虹密码 于 2020-10-19 08:58 编辑

雪板待人热情谦和,经常帮助大家解决问题,都非常感谢他

随心而遇 发表于 2020-10-19 11:07:39

互帮互助 快乐一家人

雪千寻 发表于 2020-10-19 13:17:21

感谢相遇、感谢信任、感谢你在、感谢所有。。。
页: [1]
查看完整版本: 谢谢