博客学堂
首页>>博客代码>>新浪博客代码>> 简洁播放器和美化后的播放器

简洁播放器和美化后的播放器

来源:博客学堂  | 添加时间:2007-8-5 10:51:11 | 我要投稿 | 提问

最常用到的几款播放器

下面几款播放器的样式看起来一样,但是取决于你的音乐格式

效果预览:

经典播放器以及美化的播放器

1、代码如下:

<EMBED src="歌曲地址"  width=300 height=50 type=audio/mpeg loop="-1" autostart="FALSE" volume="0">

2、代码如下:

<EMBED style="FILTER: invert()" src="歌曲地址" width=300 height=50 type=audio/mpeg volume="0" autostart="FALSE" loop="true">

3、代码如下:

<EMBED style="FILTER: Xray" src=歌曲地址 width=300 height=05 type=audio/mpeg loop="-1" autostart="FALSE" volume="0">

4、代码如下:

<EMBED style="FILTER: GRAY()" src="歌曲地址" width=300 height=45 type=audio/mpeg loop="-1" autostart="FALSE" volume="0">

代码说明:

1 WIDTH代表播放器宽度,HEIGHT代表高度,后面的数值可依自己喜好进行调整。

2 AUTOSTART="TRUE" 这里TRUE代表自动播放,如果换成FALSE则代表手动播放。

开始美化你的播放器吧!

有了常用的款式后,我们就可以巧用HTML的表格,根据自己的图片素材,再加上自己的聪明,美化就不发愁了。只要你创意够酷,调整代码,就可以得到各式各样的播放器。这里先介绍几款。

黑色播放器(附带边缘效果)

经典播放器以及美化的播放器

代码如下:

<TABLE style="BORDER-RIGHT: #000000 3px dashed; BORDER-TOP: #000000 3px dashed; BORDER-LEFT: #000000 3px dashed; BORDER-BOTTOM: #000000 3px dashed" cellSpacing=0 cellPadding=0 bgColor=#00000>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#000000 align=center border=1>
<TBODY>
<TR>
<TD><P align=center><EMBED style="FILTER: Xray" src=http://cherry.jazzsky.com/LIU/all_about_you.wma width=300 height=45 type=audio/mpeg volume="0" autostart="false" loop="- 1"></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

粉色边缘的播放器

经典播放器以及美化的播放器

代码如下:

<TABLE style="BORDER-RIGHT: #ff69b4 3px dotted; BORDER-TOP: #ff69b4 3px dotted; BORDER-LEFT: #ff69b4 3px dotted; BORDER-BOTTOM: #ff69b4 3px dotted" cellSpacing=0 cellPadding=0 align=center bgColor=white>
<TBODY>
<TR>
<TD><TABLE borderColor=#ff69b4 align=center bgColor=#ffccf5 border=2>
<TBODY>
<TR>
<TD style="FILTER: alpha(opacity=100,style=3)">
<P align=center><EMBED src=歌曲地址 width=300 height=45 type=audio/mpeg volume="0" autostart="false" loop="-1"></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

透明表格的播放器

经典播放器以及美化的播放器

代码如下:

<TABLE borderColor=#4f3256 align=center background=http://upload.yourblog.org/20057/kaka967.20050722115212.png border=1>
<TBODY>
<TR>
<TD style="FILTER: alpha (opacity=50,style=3)">
<P align=center><EMBED src=歌曲地址  width=300 height=45 type=audio/mpeg loop="-1" autostart="false" volume="0"></P></TD></TR></TBODY></TABLE>

动态背景做底图的播放器

经典播放器以及美化的播放器

代码如下:

<TABLE borderColor=#dee4fe cellSpacing=3 cellPadding=0 background=背景图片地址 border=2>
<TBODY>
<TR>
<TD>
<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: alpha (opacity=60,style=3)">
<P align=center><EMBED style="FILTER: Gray" src=歌曲地址  width=300 height=45 type=audio/mpeg volume="0" autostart="false" loop="-1"> </P></TD></TR></TBODY></TABLE></TD></TR></TBODY> </TABLE>

添加方法:

登陆新浪博客-管理博客-自定义设置-首页内容维护-自定义空白面板-进入编辑-新增面板-给面板命名-勾选左下角的显示源代码-然后在<div></div>后面点击两下空格键-粘贴代码-再次勾选显示源代码-然后你就会看到效果了-然后点击保存返回-然后点击返回

返回到管理博客的页面-自定义设置-定制我的首页-添加模块-勾选刚才新建的模版-然后用鼠标调整模块位置-然后点击保存设置!

收藏和分享:
打印】【返回顶部】【关闭

我来说两句

用户名: 新注册) 密码: 匿名评论 [所有评论]
评论内容:不能超过250字,请留下您的联系方式,方便我们回复您的留言。

网站地图 - 关于我们 - 版权声明 - 广告服务 - 联系我们 - 诚聘英才 - 帮助中心
Copyright © 2007-2008 www.blog286.com all Right Reserved
博客学堂 版权所有