首頁 > web前端 > html教學 > Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose

Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose

WBOY
發布: 2016-06-24 11:34:30
原創
1377 人瀏覽過


通过设置一些属性 让它变成这样 其实我的初衷是想改变它的样式,比如找个图标替换掉,有什么办法么


回复讨论(解决方案)

<audio src="xx.mp3" id="aud"></audio><img  src="play.png" onclick="aud_play()" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><img  src="pause.png" onclick="aud_pause()" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><script type="text/javascript">function aud_play() {	document.getElementById("aud").play();}function aud_pause() {	document.getElementById("aud").pause();}</script>
登入後複製
登入後複製
登入後複製

<audio src="xx.mp3" id="aud"></audio><img  src="play.png" onclick="aud_play()" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><img  src="pause.png" onclick="aud_pause()" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><script type="text/javascript">function aud_play() {	document.getElementById("aud").play();}function aud_pause() {	document.getElementById("aud").pause();}</script>
登入後複製
登入後複製
登入後複製



<audio src="xx.mp3" id="aud"></audio><img  src="play.png" onclick="aud_play()" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><img  src="pause.png" onclick="aud_pause()" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><script type="text/javascript">function aud_play() {	document.getElementById("aud").play();}function aud_pause() {	document.getElementById("aud").pause();}</script>
登入後複製
登入後複製
登入後複製

这个能不能只用一个图标,点击一次暂停,下一次播放

<audio src="xxx.mp3" id="aud"></audio><img  src="play.png" id="playpause" / alt="Html audio 怎么更改样式 大神来看下_html/css_WEB-ITnose" ><script type="text/javascript">var aud = document.getElementById("aud");var img = document.getElementById("playpause");img.onclick = function() {	if (aud.paused) {		aud.play();	} else {		aud.pause();	}}aud.addEventListener("play", function (e) {	img.src="pause.png";}, false);aud.addEventListener("pause", function (e) {	img.src="play.png";}, false);</script>
登入後複製

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板