MP3-jPlayer: skip to minutes by clinking the timeline

On this page I have the MP3-jPlayer WordPress plugin with the Text Skin, slightly modified.

I have deleted the volume bar from the plugin's html/php structure. I have also added a "seekbar":

<div class="seekbar-wrapper">
  <div class="seekbar-container">
   <div class="seekbar" value="0" max="1"></div>
  </div>
</div>

I have modified the plugin's mp3-jplayer-2.7.js file in order to show, for every track (mp3 files), the timeline. After line 403 (jQuery(this.eID.indiM + j).empty().append(' ' + this.Tformat(pt));) I have added:

var sbContainerWidth = $('.seekbar-container').width();
var progValue = pt / tt * 100;
var progPercentage = progValue + '%';                           
$('#mp3jWrap' + '_' + this.tID).closest('li').find('.seekbar').width(progPercentage);

The result of this is the presence of a progress bar that was missing before.

I have tried to make the seekbar react to a click event and update the track's "timer:

var sbContainerWidth = $('.seekbar-container').width();
function skip(ev) {
    pt = ev.pageX -  $('.seekbar-container').offsetLeft; 
}
 $('.seekbar-container').on('click', skip(ev));

But unfortunately it does not react to the clicking (and the timeline does not update). More exactly: What I am trying to do is update "pt", upon click to skip to the point on the seekbar where the click occurs: pt = ev.pageX - $('.seekbar-container').offsetLeft;

Why? Where is the mistake?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.