jMediaelement API

												$('video').play();
											

												$('video').pause();
											

												$('video').togglePlay();
											

												jmeLog( 'isPlaying: '+ $('video').isPlaying() );
											

This method works as a setter and a getter. If you provide a boolean, it will set the mute-state, otherwise it will return the mute state.

												//getting the mute state
												jmeLog( 'muted-state: '+ $('video').muted() );
											

												//mute the video
												$('video').muted(true);
											

												//unmute the video
												$('video').muted(false);
											

												//toggle muted-state of all audio elements
												$('audio').toggleMuted();
											

This method works as a getter and a setter. If you provide a number (between 0-100) as the first argument, it will set the volume, otherwise it will return the current volumelevel.

												//get the volume level
												jmeLog( 'volume-level: '+ $('video').volume() );
											

												//set volume to 50
												$('video').volume(50);
											

currentTime works as a getter and a setter. If you call method with a float as first argument the media element will seek to this position in seconds, otherwise it returns the time-position in seconds.

												jmeLog( 'position: '+ $('video').currentTime() );
											

												//set currentTime to 10 seconds
												$('video').currentTime(10);
											

Note: Altough setting the currentTime works on most devices, before metadata was loaded, you can not be sure of it. Please wait till loadedmeta event occured before setting currentTime.

												jmeLog( 'position: '+ $('video').getFormattedTime() );
											

												jmeLog( 'position: '+ $('video').relCurrentTime() );
											

												//skip half of the video
												$('video').relCurrentTime(50);
											

												jmeLog( 'position: '+ $('video').getDuration() );
											

												jmeLog( 'position: '+ $('video').getFormattedDuration() );
											

If normal methods are used, they are automatically queued, if the media element is not ready. This is fine for setting the state (i.e.: .muted(true)). But if you want to get the state at the beginning, you should use jmeReady.

												$('video').jmeReady(function(){
													jmeLog( 'muted-state: '+ $(this).muted() );
												});
											

												//load new audio sources into the audio-element
												//and start playing
												$('audio')
													.loadSrc( [
														'../media/ANC_sketchV2n.mp3',
														'../media/ANC_sketchV2n.ogg'
													] )
													.play()
												;
											

You can also use one file as a string

												$('video').loadSrc( 'path/my-video.mp4' );
											

You can also use the poster-src argument to load a new poster-frame

												//new video with a new poster
												$('video').loadSrc( 'path/my-video.mp4', 'path/my-poster.jpg' );
											

If you don´t provide the poster-src argument, but the poster-attribute is still defined in the markup, this source will be used as a poster.

If you want to delete the poster-attribute, you can simply pass false.

												$('video').loadSrc( 'path/my-video.mp4', false );
											

The code above is equivalent to the following code.

												$('video')
													.removeAttr('poster')
													.attr('srces', 'path/my-video.mp4')
													.loadSrc(  )
												;
											

With jMediaelement it is extremly easy to create pre rool-/post rool ads or playlist.

												$('audio')
													//wait till audio playback is ended...
													.one('ended', function(){
														// then load new source
														$(this)
															.loadSrc( [
																'../media/chefsachesketch.mp3',
																'../media/chefsachesketch.ogg'
															] )
															// and play
															.play()
														;
													})
												;
											

The mediaLabel parameter changes the Content of your media-label-element or its media-name-element.

If autoplay is set to true before you have called jmeEmbed or loadSrc. The current media source will be played automatically.

												//set the autoplay property to true
												$('audio').attr('autoplay', true);
											

												//set the autoplay property to false
												$('audio').attr('autoplay', false);
											

												//get the autoplay property
												jmeLog( $('audio').attr('autoplay') );
											

If loop is set to true before a media element finishes playing, the playback starts again after the ended-event.

												//set the loop property to true
												$('audio').attr('loop', true);
											

												//set the loop property to false
												$('audio').attr('loop', false);
											

												//get the loop property
												jmeLog( $('audio').attr('loop') );
											

Currently this attribute is only taken into account, before you have called the jmeEmbed-method.

The src-property will always return an absolute path, even if you have used a relative path.

The poster attribute always returns a absolute path, even if you have used a relative path.

The srces attribute is a "meta"-attribute and makes it really easy to work with multiple sources for a media element.

Setting media-srces with the srces-attr-method will first remove all found source elements and src attributes and then set the source.

Example: The following HTML

												<audio class="my-audio" src="my-source.mp3"></audio>
											

will be transormed by this code...

												$('audio.my-audio').attr('srces', 
													[
														'my-mp3.mp3', 
														'my-ogg.ogg'
													]
												);
											

to the following HTML:

												<audio class="my-audio">
													<source src="my-mp3.mp3" />
													<source src="my-ogg.ogg" />
												</audio>
											

Getting the srces will always return an array of media-src object. Even if used on a media element with only one src-attribute.

												<audio class="my-audio" src="my-source.mp3"></audio>
											

												$('audio.my-audio').attr('srces');
												// will return 
												/*
													[ {
														src: 'absolute-path/my-source.mp3'
													}]
												*/