UPDATE. To be more specific:
if ('single' === this.pl_info[j].type){ if (pt > 0 ) { if (this.played_t === pt && lp < 99 && !this.sliding ) { jQuery(this.eID.indiM + j).empty().append('<span class="Smp3-finding"></span><span class="mp3-gtint"></span> ' + this.Tformat(pt)); } else { jQuery(this.eID.indiM + j).empty().append('<span class="Smp3-tint tintmarg"></span> ' + this.Tformat(pt)); /* My Code Begin*/ var skipbarWidth = $('.seekbar-container').width(); $('.seekbar-container').on('click', function(ev){ var skipTo = ev.pageX - $(this).offset().left; ppA = skipTo/skipbarWidth * 100; var progPercentage = ppA + '%'; $('#mp3jWrap' + '_' + this.tID).closest('li').find('.seekbar').width(progPercentage); console.log(ppA); }); var progPercentage = ppA + '%'; $('#mp3jWrap' + '_' + this.tID).closest('li').find('.seekbar').width(progPercentage); /* My Code End*/ } } } I wish the seekbar reacted to clicking on it. By updating.
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('<span class="Smp3-tint tintmarg"></span> ' + 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?
0 comments:
Post a Comment