jQuery UI Slider作为音量滑块

Question

I am in the process of developing a custom volume slider for FlowPlayer based on the standard jQuery UI Slider. What I would like is some help connecting the slider with the HTML5 video volume controls.

This is the code that initiates the video

  <video id="mp3" autoplay>
  <source id="mp3source" src="mysource" type="audio/mp3">

I created a jQuery slider to control the volume

  $(function() {
    $( "#slider" ).slider();
  });

Is there a way I can manipulate the video volume depending on the slider's position ?

Thank you in advance

Answer 1

Maybe this will help you / give you impressions what to do:

$( "#slider" ).on( "slide", function( event, ui ) {
    $('#mp3')[0].volume = Math.round(ui.value / 100);
} );

• JQueryUI slide Event description
• HTML Audio/Video DOM Reference
• get the DOMElement from the jQuery Selector $('#mp3')[0]