<!--audio start 影音播放--> <DIV class="weixinAudio" style="display:none;"> <audio src="" id="media" width="1" height="1" preload></audio> <span id="audio_area" class="db audio_area"> <span class="audio_wrp db"> <span class="audio_play_area"> <i class="icon_audiodefault"><img src="/images/shengyin02.png" alt=""></i> <i class="icon_audioplaying"><img src="/images/shengyin.png" alt=""></i> </span> <span id="audio_length" class="audio_length tips_global"></span> <span id="curent_time">0:00</span> <span class="db audio_info_area"> <strong class="db audio_title">成飞建筑材料责任有限公司宣传片配音</strong> </span> <span id="int_c"></span> <span class="progress_bar_box" style="width:1100px"> <span id="audio_progress" class="progress_bar" style="width: 0%;"></span> </span> </span> </span> </DIV> <script src="/js/jquery-1.10.2.js"></script> <script src="/js/weixinaudio.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> var videosrc = ''; $(".yangyin_list ul li").click(function(){ var onindex = $(this).index(); var ontitle = $(this).find(".yangyin_tit").html(); $(".weixinAudio .audio_info_area strong").html(ontitle); $(".weixinAudio").toggle(); videosrc = $(this).data("video"); $(".weixinAudio audio").src=videosrc; $('.weixinAudio').weixinAudio({ autoplay:true, src:videosrc, }); } ) </script> <script> var a=0; $(".audio_play_area").click(function () { a++; if(a%2!=0){ $(".icon_audiodefault").css({"display":"none"}); $(".icon_audioplaying").css({"display":"block"}); console.log(a); } if(a%2==0){ console.log(a); $(".icon_audiodefault").css({"display":"block"}); $(".icon_audioplaying").css({"display":"none"}); } }) </script> <!--audio end-->
jq引用还不能错
附加:video标签播放,控制开始暂停等,加 controls
<video id="shiping" height="500px;"width="850px;" autoplay="" controls> <source src="videosource" type="video/mp4"> <source src="videosource" type="video/ogg"> </video>