寒冬残荷
发表于 2022-9-21 21:01
195400 发表于 2022-9-21 20:34
我试试看看有什么不同
试过了,给各位报告一下,电脑微信打开可以自动播放,手机则不行。
我没有安装微信电脑版。我是用微信网页版,把电脑上的东西传到手机。
这个乚RC代码在手机上真的能自动播放音乐。
寒冬残荷
发表于 2022-9-21 21:16
刚才在网上搜索了一下,得到如下的一段文字:
解决HTML5中的audio在手机端和微信端的不能自动播放问题
audio在手机端和微信端添加了autoplay以后还是不可以自动播放,这是因为手机端为了节约流浪所设置的。
<audio loop src="/photo/aa.mp3" id="audio" autoplay preload="auto">该浏览器不支持audio属性</audio>
解决方法:
//--创建页面监听,等待微信端页面加载完毕 触发音频播放。
document.addEventListener('DOMContentLoaded', function () {
function audioAutoPlay() {
var audio = document.getElementById('audio');
audio.play();
document.addEventListener("WeixinJSBridgeReady", function () {
audio.play();
}, false);
}
audioAutoPlay();
});
//--创建触摸监听,当浏览器打开页面时,触摸屏幕触发事件,进行音频播放
document.addEventListener('touchstart', function () {
function audioAutoPlay() {
var audio = document.getElementById('audio');
audio.play();
}
audioAutoPlay();
});
还有一种针对苹果的手机微信端的解决方法
第一步:引入js文件
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
第二步:配置文件
<script>
function autoPlayVideo(){
wx.config({
debug:false,
appId:"",
timestamp:1,
nonceStr:"",
signature:"",
jsApiList:[]
});
wx.ready(function(){
var autoplayVideo=document.getElementById("audio");
autoplayVideo.play()
})
};
autoPlayVideo();
</script>
这样在网络稳定的情况下是可以自动播放的。
寒冬残荷
发表于 2022-9-21 21:17
寒冬残荷 发表于 2022-9-21 21:16
刚才在网上搜索了一下,得到如下的一段文字:
解决HTML5中的audio在手机端和微信端的不能自动播放问题
老师们你们能看得懂,我是看不懂的:P
195400
发表于 2022-9-21 21:32
寒冬残荷 发表于 2022-9-21 21:17
老师们你们能看得懂,我是看不懂的
若不是你们在这讨论手机的问题,我就不会想到还有手机浏览的事,电脑上都嫌字小手机就不要考虑了:L
195400
发表于 2022-9-22 06:26
<style type="text/css">
@import"http://cesholl.cn3v.work/sstyle/lrcPlayerZ.min.css";
#div1{position:relative; width: 1000px; height: 600px; margin: 15px auto; overflow : hidden; box-shadow: 0px 0px 0px 2px #cccccc, 0px 0px 5px 15px #600030; background-size:100% 100%;background-image:url(https://s1.ax1x.com/2022/03/13/bbOClQ.gif); }
#dhx{animation: slider1 5s linear infinite ;width:700px; height:600px; position:absolute; top:50px; left:-120px; -webkit-mask-image:radial-gradient(black 25%, transparent 60%);}
@keyframes slider1 {
from {opacity: 1;filter:hue-rotate(360deg)contrast(120%)brightness(140%);}
50% {opacity: 1;filter:hue-rotate(0deg)contrast(100%)brightness(100%);}
to {opacity: 1;filter:hue-rotate(360deg)contrast(120%)brightness(140%);}}
.maskgif {width:100%; height:100%; position: absolute;top:0px; left:0px;}
.mCtrl {
/** 控制光盘显示的缺省设置:
width:90px;height:90px; 光盘大小
bottom:30px;right:30px; 光盘位置
background-image:url(http://pan.yinhuabbs.cn/view.php/a93202bcdcd7cc95412d1595f9ec0dba.png); 光盘图片 **/
width:50px;height:50px;left:80px;
}
.lrcShow {
/** LRC歌词显示的缺省设置:
font:bold 3em sans-serif; 字体设置
background-image:linear-gradient(-90deg,darkblue,yellow);歌词前景,背景色
bottom:20px;left:20%; 显示位置 **/
font:bold 60px 等线; font-size:3.5em;left:25%;
}
</style>
<div id="div1">
<img id="dhx" src="https://pic.imgdb.cn/item/631f43ef16f2c2beb1a57359.gif" />
<img src="http://chuangshicdn.data.mvbox.cn/album/22/03/14/22031417263445440463.gif" class="maskgif" />
<img src="http://chuangshicdn.data.mvbox.cn/album/22/03/12/22031213392999032271.gif" class="maskgif" />
<div class="items" style="position:absolute; top:50px; right:50px; color:#fff000;width:320px;height:80px; font-family:华文隶书; font-size:35px;filter:drop-shadow(#000000 1px 0 0)drop-shadow(#000000 0 1px 0)drop-shadow(#000000 -1px 0 0) drop-shadow(#000000 0 -1px 0);"> 吉特巴舞曲- </br>《唱着歌儿嗨起来》</div>
<divclass="lrcShow" id='sLRC'></div>
<divid="mDisk" class='mCtrl'></div>
</div>
<script type="text/javascript">
document.write('<script src="http://cesholl.cn3v.work/scripts/lrcPlayerZ.packed.js" type="text/javascript"><\/script>');
</script>
<script type="text/javascript">
var lrc =`
《唱着歌儿嗨起来》
词:李秉笙
曲:敏子
演唱:敏子/许志刚
LRC歌词:寒冬残荷
你正在赶路
我在爬坡
人生就是一首歌
一呀一首歌
起起落落悲喜
悲喜都有
曲曲折折快乐
快乐度过
你正在翻山
我在趟河
人生就是一首歌
一呀一首歌
坎坎坷坷共同
共同闯过
风风雨雨一起
一起坚守
人生就是一首歌
一呀一首歌
酸甜苦辣唱着过
唱呀唱着过
月圆月缺人有离合
唱出快乐好生活
好呀好生活
人生就是一首歌
一呀一首歌
得失成败唱着过
唱呀唱着过
天有阴晴潮有涨落
唱着歌儿好幸福
好呀好幸福
风雨过后就有彩虹
寒冬尽头有春色
有呀有春色
只要你执着
执着朝前走
酸甜苦辣都是歌
都是歌
艰难困苦都是财富
一张白纸绘蓝图
绘呀绘蓝图
只要你坚强
坚强不退缩
青春年华莫错过
莫错过
人生就是一首歌
一呀一首歌
酸甜苦辣唱着过
唱呀唱着过
月圆月缺人有离合
唱出快乐好生活
好呀好生活
人生就是一首歌
一呀一首歌
得失成败唱着过
唱呀唱着过
天有阴晴潮有涨落
唱着歌儿好幸福
好呀好幸福
天有阴晴潮有涨落
唱着歌儿好幸福
好呀好幸福
唱着歌儿好幸福
好呀好幸福
【谢谢观看!】
`;
var opts = {
lrcTxt:lrc,
lrcShowID:'sLRC',
audioCtrl:'mDisk',
// 歌曲MP3链接放这里
audioURL:'http://url.amp3a.com/kuwo.php/54238887.mp3'
};
new lrcPlayerZ(opts);
</script>
寒冬残荷
发表于 2022-9-23 09:42
195400 发表于 2022-9-21 19:42
看看这个是不是自动播放
这个在手机上不能自动播放。
寒冬残荷
发表于 2022-9-23 09:43
195400 发表于 2022-9-22 06:26
@import"http://cesholl.cn3v.work/sstyle/lrcPlayerZ.min.css";
#div1{position:relative; width:...
这个在手机上能自动播放。
寒冬残荷
发表于 2022-9-23 09:46
195400 发表于 2022-9-21 21:32
若不是你们在这讨论手机的问题,我就不会想到还有手机浏览的事,电脑上都嫌字小手机就不要考虑了
在手机上看方便,到哪都可以看看呀。而且我注册的网站,就这个网站能在微信中打开浏览。用手机自带的浏览器也能看,但有广告,我讨厌!微信中打开这个论坛目前没看到广告,我喜欢。
寒冬残荷
发表于 2022-9-23 09:48
195400 发表于 2022-9-21 21:32
若不是你们在这讨论手机的问题,我就不会想到还有手机浏览的事,电脑上都嫌字小手机就不要考虑了
我也嫌字小,但我带老花镜。反正我现离不开老花镜,在电脑上字大我也是要带老花镜,否则看不到字。
寒冬残荷
发表于 2022-9-23 09:54
我没什么喜欢的,就喜欢看音画代码,觉得很神奇,写写几行代码就得到漂亮的画面。所以我发帖目的是有空时用手机看看音乐代码得到的神奇画面和听听我喜欢的音乐。