banu prakash banu prakash - 17 days ago 6
CSS Question

how to get audio on clickeing the image using javascript and pause when playing

<img class="cl"src="photo/198.jpg"/></br>
<audio class="cs" controls>
<source src="audio/198 banu nagamothu.mp3" type="audio/mpeg">
</audio>


I dont want controls to audio first but when i clicked the image audio should played using javascript and html

Answer

Use AudioElement.paused property!

$('.cl').click(function() {
  var DOMElem = $('.cs').get(0);
  DOMElem.paused ? DOMElem.play() : DOMElem.pause();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<img class="cl" src="photo/198.jpg" />
</br>
<audio class="cs">
  <source src="http://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
</audio>

Comments