前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >网页背景音乐设置

网页背景音乐设置

作者头像
青梅煮码
发布2023-03-13 16:00:59
3K0
发布2023-03-13 16:00:59
举报
文章被收录于专栏:青梅煮码

一、添加背景音乐时,一般会用到两种标签:

1、<bgsound>

2、<embed>

二、一般用法 :

<bgsound src=”音频源” autostart=”true” loop=”false” />

<embed src=”音频源” autostart=”true” loop=”false” />

三、标签属性 :

1、autostart 当为 true 时 是自动播放模式 。反之, 当为false时 为一开始不进行自动播放(默认为false);

2、loop 当为 true 时 是无限次重播,false为不重播,某一具体值(正整数)为重播多少次;

3、当添加属性 hidden=”true” 时 为隐藏控制面板;

四、兼容问题

1、<bgsound> 标签 为 IE

2、<embed> 为其它

3、值得注意的是 当为IE9时 , 两标签都为支持;

TIPS :

例如:给 <div class=”mp3”></div>添加音频播放文件时。

(一)、正常情况下的写法:

if($.browser.msie){ $(“.mp3″).html(‘<bgsound src=”music/one.mp3″ autostart=”true” loop=”true” hidden=”true” />’); }else{ $(“.mp3″).html(‘<embed src=”music/one.mp3″ autostart=”true” loop=”true” hidden=”true” />’); }

现象:IE内核的没有声音:其它的有!

原因:<bgsound >标签在IE内核里是不会被直接读取的,所以。。。

解决:在判断为IE内核时 把两个标签都加载进去 ,而已<embed>标签要在<bgsound>前,并且将自动播放设置为 autostart=”false”;

如:

if($.browser.msie){ $(“.mp3”).html(‘<embed src=”music/one.mp3″ autostart=”false” loop=”true” hidden=”true” /><bgsound src=”music/one.mp3″ autostart=”true” loop=”true” hidden=”true” />’); }else{ $(“.mp3″).html(‘<embed src=”music/one.mp3″ autostart=”true” loop=”true” hidden=”true” />’); }

(二)、可能会有这样的一种特殊特殊情况:

现象:IE内核的出现重音(或当是启用浏览器的兼容性视图时出现);

原因:个人初步认为这是音频在切换的延迟问题;

根据:当我在给 <div class=”mp3”></div>添加音频播放文件前,来一个alert(“dd”)弹窗事件后,则音频播放正常;

解决:为了安全起见,设置延时一秒加载的同时,前利用else再进行对其它浏览器进行判断,最终写法如下:

if($.browser.msie){ setTimeout(function(){ $(“.mp3”).html(‘<embed src=”music/one.mp3″ autostart=”false” loop=”true” hidden=”true” /><bgsound src=”music/one.mp3″ autostart=”true” loop=”true” hidden=”true” />’); },1000); }else if(.browser.mozilla || .browser.opera || $(“.mp3″).html(‘<embed src=”music/one.mp3″ autostart=”true” loop=”true” hidden=”true” />’); }

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-05-20 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档