carregar a imagem no onclick
Galera me ajuda ai,. estou com mais um problema já e não o erro, onclick não carrega a imagem do pause
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>Cantora Gospel</title>
<meta name="">
<meta name="decription" content="">
<link rel="stylesheet" href="css/estilo.css">
<script type="text/javascript" src="js/controls.js"></script>
</head>
<body id="home">
<header>
<div id="wrapper">
<audio id="mytrack" controls>
<source src="audio/som.mp3" type="audio/mp3"/>
</audio>
<nav>
<div id="defaultBar">
<div id="progressBar"></div>
</div>
<div id="buttons">
<button type="button" id="playButton" onclick="playOrPause()"></button>
<button type="button" id="muteButton"><button>
<span id="currentTime">0:00</span>
/ <span id="fullDuration">0:00</span>
</div>
</nav>
</div>
</header>
<script type="text/javascript" src="js/controls.js"></script>
<div class="container">
<nav id="menu">
<ul id="nav">
<li><a href="index.html" id="ho">Home</a></li>
<li><a href="news.html">News</a></li>
<li><a href="perfil.html">Perfil</a></li>
<li><a href="fotos.html"class="active">Fotos</a></li>
<li><a href="videos.html">Videos</a></li>
<li><a href="discografia.html">Discografia</a></li>
</ul>
</nav>
<section>Conteudo</section>
<aside>Relacionado</aside>
<footer>Roda Pé</footer>
</div>
</body>
</html>
CSS
#defaultBar{
width:640px;
position:relative;
background-color:#606060;
height:10px;
}
#progressBar{
position:absolute;
height:0px;
background-color:#3498db;
width:100px;
}
#playButton{
background-color:rgb(250,250,250);
border:none;
height:20px;
width:20px;
background-image: url(../imagens/play.png);
background-repeat:no-repeat;
background-position:center;
}
#muteButton{
background-color:rgb(250,250,250);
border:none;
height:20px;
width:20px;
background-image: url(../imagens/speak.png);
background-repeat:no-repeat;
background-position:center;
}
#muteButton:active,#playButton:active {
position:relative;
top:2px;
}
JAva Script
var mytrack = document.getElementById('mytrack');
var playButton = document.getElementById('playButton');
function playOrPause(){
if(!mytrack.paused && !mytrack.ended){
mytrack.pause();
playButton.style.backgroundImage = 'url(../imagens/play.png)';
}
else{
mytrack.play();
playButton.style.backgroundImage = 'url(../imagens/pause.png)';
}
}
O erro
Failed to load resource: net::ERR_FILE_NOT_FOUND
Discussão (3)
Carregando comentários...