Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

159
Views
Music Player not pausing

I am developing a music player using PHP/mysql and JQuery and I am having trouble "Pausing" the audio. Currently when it pauses it starts from the beginning again, Am i missing something? is there a better way to do this?

Index.php

<?php
include 'header.php';
include 'config/config.php';
?>

<div class="content">
     <div class="left-sidebar">
     <table>
<?php
$sql = "SELECT mp_id, mp_name, mp_desc, mp_img, mp_media FROM media";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
        echo '
        <tr>
        <td class="image-song"><img class="song-img" src="'.$row["mp_img"].'"/>
        ' . $row["mp_name"]. '
        <audio class="media-link" src="' . $row["mp_media"]. '"> </audio> 
        <button class="left-play" type="button" onclick="playAudio(this)"><img src="images/play-button.svg"></button> 
        <button class="left-pause" onclick="pauseAudio(this)"><img src="images/pause-button.svg"></button></td>
        </tr>
        ';
    }
} 
else {
    echo "No music available";
}
$conn->close();
?>
       </table>
    </div>

<div class="player-sec">
   <div class="main-player">
     
   </div>
  <div class="audio-controls">
     <span class="prev-btn"><img src="images/rewind-button.svg"></span> 
     <span class="play-btn" onClick="playAudio()"><img src="images/play-button.svg"></span> 
     <span class="next-btn"><img src="images/forward-button.svg"></span> 
   </div>
</div>

<?php
include 'footer.php';
?>

Javascript.js

function playAudio(playButton) {
    jQuery('audio').each(function() {
        this.pause();
        this.currentTime = 0;
    });

  var song = playButton.previousElementSibling;
  song.play();

   var element = document.getElementsByClassName("left-play");
   element.classList.add("active");

   var element = document.getElementsByClassName("left-pause");
   element.classList.add("pausable");
}

function pauseAudio(pauseButton) {
    jQuery('audio').each(function() {
       this.pause();
    });

    var nsong = pauseButton.getElementsByClassName("media-link");
    nsong.pause();
 }
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!