注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

柠檬荔子的原创音画空间

浮华一生,淡忘一季。空有回忆,落寞万千;弦,思华年

 
 
 

日志

 
 
关于我

  昨日的指尖触动着时间的针脚,从古典中走来,穿过千年的时光,只为了寻觅到我指尖残留的余香?……彻底放下!让灵魂自由的飞升吧!

网易考拉推荐

【转载】图片上写入滚动歌词字幕和播放器的代码  

2014-06-19 11:52:26|  分类: 【代码习作】 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

(一)图片上写入滚动歌词字幕和播放器的代码:

 

<CENTER>
<CENTER>
<TABLE style="WIDTH: 498px; HEIGHT: 736px" width=498 border=0 HEIGHT:="" WIDTH:="">
<TBODY>
<TR>
<TD background=图片地址

height=736>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P align=center><EMBED style="FILTER: Xray; WIDTH: 450px; HEIGHT: 45px" src=音频地址 width=450 height=45 type=audio/mpeg LOOP="- 1" VOLUME="0"></EMBED></P>
<P>&nbsp;</P>
<P align=center>
<MARQUEE style="WIDTH: 450px; HEIGHT: 24px" scrollAmount=1 width=450><FONT color=#ffffff>歌词文字</FONT></FONT></FONT></MARQUEE></P>
<P align=center>&nbsp;</P></TD></TR></TBODY></TABLE></CENTER>

<CENTER>&nbsp;</CENTER></CENTER>

这里开始

 
    说明:红色为图片部分,注意图片两个宽(WIDTH)和高(HEIGHT)的数值,尤其是图片地址下面的那个HEIGHT数值,宽度是文章模板默认的,不要更改,高度要与你链接的图片实际像素高度一致。蓝色为播放器,为不自动播放,则为自动播放。粉色为滚动歌词,scrollAmount=1为速度,数值越大速度越快,color=#ffffff为字体颜色。可以将光标放在播放器上面用回车键和删除键上下调整播放器和滚动歌词的位置,也可在文章编辑器里采用剪切复制的办法调换播放器和滚动歌词的位置。

 

 

(二)图片上只写入滚动歌词字幕的代码:

 

<CENTER>
<CENTER>
<TABLE style="WIDTH: 498px; HEIGHT: 338px" width=498 border=0>
<TBODY>
<TR>
<TD background=图片地址

height=338>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center>
<MARQUEE style="WIDTH: 448px; HEIGHT: 18px" scrollAmount=1 width=448><FONT color=#ffffff><FONT color=#000000><FONT color=#767676>歌词文字</FONT></FONT></FONT></MARQUEE></DIV></TD></TR></TBODY></TABLE></CENTER>
<CENTER><EMBED style="FILTER: Xray; WIDTH: 498px; HEIGHT: 45px" src=音频地 width=498 height=45 type=audio/mpeg VOLUME="0" LOOP="- 1">&nbsp;</CENTER></CENTER>

 

说明:这组代码操作原理与上面的基本一致,只不过是将播放器放在了图片的下方而已。

 

 

(三)图片上写入音乐标题和播放器的代码:

 

<TABLE style="WIDTH: 500px; HEIGHT: 360px" width=500 border=0>
<TBODY>
<TR>
<TD background=图片地址

height=360>

<FONT color=#ffffff>&nbsp;</FONT>&nbsp;&nbsp;
<MARQUEE style="WIDTH: 183px; HEIGHT: 200px" scrollAmount=1 scrollDelay=1 direction=up width=183 height=200><FONT style="FONT-SIZE: 56px; FONT-FAMILY: 黑体" color=#ffffff>音乐标题</FONT><BR><BR></MARQUEE>
<DIV style="FILTER: glow(color=#000000 ,strength=1); WIDTH: 212px; COLOR: #000000; HEIGHT: 13px"></DIV>&nbsp;&nbsp; &nbsp;<FONT color=#ffffff><EMBED style="FILTER: Xray" src=音品地址 width=180 height=45 type=audio/mpeg LOOP="- 1" VOLUME="0"></EMBED></FONT></TD></TR></TBODY></TABLE>

 

说明:这组代码不用解释,上面两组弄明白了,这个一看就懂。

 

 

(四)图片、滚动歌词字幕、播放器顺序排列法:

 

    这是最简单且不受模板升级影响的音画制作手段,先在文章编辑器里上传一张像素宽度为500以上的图片,敲一下回车,紧贴图片下边打上两行任意一串两种符号,勾选“显示源代码”,分别将滚动字幕代码和播放器代码替换掉那两行字符串并添上歌词和音频地址,OK!

 

滚动字幕代码:

 

<MARQUEE scrollAmount=3 width=500><FONT style="FONT-SIZE: 32px" color=#000000><FONT style="FONT-SIZE: 24px; FONT-FAMILY: 黑体"><FONT style="FONT-SIZE: 22px"><STRONG><FONT color=#000000>歌词</FONT></STRONG></FONT></FONT></FONT></MARQUEE>

 

说明:scrollAmount=3为滚动速度,color=#000000为字体颜色,FONT-FAMILY: 黑体"为字体样式,FONT style="FONT-SIZE: 22px"为字号大小。

  评论这张
 
阅读(33)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017