JavaScript如何滚动显示歌词呢?

JavaScript024

JavaScript如何滚动显示歌词呢?,第1张

第一步:将你所有的歌词放在一个层里面,每句有相等的间隔,但是层的高度设置为你想显示的那么高,溢出设置隐藏,设置为绝对定位

第二步:设置动画:让歌词的层每次间隔一定的时间向上运动setInterval函数,还可以设置透明度渐变

第三步:判断是否到达末尾然后再重头开始实现循环

把歌词放在

<ul>

<li>lrc</li>

</ul>

这里

改变ul的top或者margin-top就可以实现滚动了,当然ul的父元素

设置

overflow:hidden

height:

等因素

看我做的音乐播放器

JS 东北老家滚动歌词

大约半个世纪前

故事在山东港边

奶奶带着一家人

从此告别熟悉的家园

乘风破浪的军舰

从青岛经过福建

终点落在左营港

未知的命运才要上演

陌生的地平线

泛黄的旧照片

回忆起老家的光年

不知不觉泪满面

东北老家

如今是地图上最陌生的地方

东北老家

有着爷爷当年潇洒的风光

东北老家

为何现在的我如此的向往

东北老家

那是我的家

从左营的三合院

搬到东港的海边

曾经陌生的一切

如今变成另一种新鲜

物换星移之间

世界已经改变

所谓的家对我而言

早已模糊了界线

东北老家

如今是地图上最陌生的地方

东北老家

有着爷爷当年潇洒的风光

东北老家

为何现在的我如此的向往

东北老家

那是我的家

太平洋的那端的确不遥远

我想带着爷爷奶奶的心愿

再看一眼 那些山川

那些岁月 那些思念

东北老家

如今是地图上最陌生的地方

东北老家

有着爷爷当年潇洒的风光

东北老家

为何现在的我如此的向往

东北老家

那是我的家

东北老家

总让脆弱的我意外的坚强

东北老家

那是我的家