Last active
December 15, 2017 16:58
-
-
Save ny0m/5723736 to your computer and use it in GitHub Desktop.
A snippet to make jPlayer volume bar draggable.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$('.jp-volume-bar').mousedown(function() { | |
var parentOffset = $(this).offset(), | |
width = $(this).width(); | |
$(window).mousemove(function(e) { | |
var x = e.pageX - parentOffset.left, | |
volume = x/width | |
if (volume > 1) { | |
$("#JPID").jPlayer("volume", 1); | |
} else if (volume <= 0) { | |
$("#JPID").jPlayer("mute"); | |
} else { | |
$("#JPID").jPlayer("volume", volume); | |
$("#JPID").jPlayer("unmute"); | |
} | |
}); | |
return false; | |
}) | |
.mouseup(function() { | |
$(window).unbind("mousemove"); | |
}); |
Cafer, that code for the seek bar is great, but it glitches between the scrub position and the current playing position if the media is playing. Any thoughts on how to stop that? I tried to make the playBar update process pause by adding a global 'isScrubbing' boolean variable, but no success so far.
JohnnyOutdoors, replace
$(".jp-play-bar").css("width", barValue + "%");
to
$("#player").jPlayer( "playHead", barValue );
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
same can be applied to seek bar as well with small changes;