Well, as you might know porn industry is sometimes associated to HUGE revolutions on media…
- porn industry helped VHS/VCR beat the Betamax;
- researchers suggested that porn was the reason Blu-Ray defeated HD-DVD
- porn industry helped Wikipedia co-founder Jimmy Wales made some bucks to start it (wikipedia)http://www.cnet.com/news/so-porn-revolutionizes-technology-right/
http://www.naturalnews.com/049355_Wikipedia_pornography_Jimmy_Wales.html
http://www.businessinsider.com/wikipedia-bomis-2013-6
https://en.wikipedia.org/wiki/Bomis
On the search for articles about HTML5 responsive video players I’v found this free video player from pornzrus.com.
This is a 100% copy past from their article.
VideoControls is a open source free plugin made in jQuery for display a YouTube-Like control bar. Based on the new HTML5 tag <video>, VideoControls is cross platform, simple and free to use.
Features
- Free & Open Source
- Easy to use
- Lightweight
- Based on jQuery
- 100% skinnable using CSS
- Consistent look between browsers
- Preview on timebar mouse over
- Markers on timebar
- Buffer loading visibility
- Medium and Full screen
- Play/pause, seek
- Volume Control
- Mute/unmute
- Mobile compatible
Change log
2014-06-09 - v1.5 + features - option preview height added and optional - option preview wide optional == 2014-04-10 - v1.4 + methods - fillscreenToggle - fullscreenToggle - mediumscreenToggle - playToggle + events - durationchange - end - fillscreenchange - fullscreenchange - load - mediumscreenchange - pause - play - seekchange - volumechange * bugs - video centred == 2014-03-09 - v1.3 + features - button to fill video on the player * bugs / other - less attributes - original width and height is assigned in video attributes if not specified == 2014-02-26 - v1.2 * bugs: - if not supported back to the native video player == 2014-02-16 - v1.1 + features - preview argument is optional * bugs: - localStorage in privacy mode - mobile fullscreen == 2014-01-25 - v1.0 initial release know bugs: - firefox with jpg width > 30.000px - safari (all platform)
Download
Download lastest version of VideoControls jQuery plugin
Source code is available on GitHub : https://github.com/pornzrus/videocontrols
Installation
1. Include the css on your html <head>
<link type="text/css" rel="stylesheet" href="jquery.videocontrols.css">2. Include the script after the jQuery library
<script type="text/javascript" src="jquery.videocontrols.js">3. Display the VideoControls on your <video>
<script type="text/javascript">
$('video').videocontrols();
</script>Options
- markersarray of numbers
- times in seconds to put markers on timebar
- previewobject
-
- spritesarray
- sprites path
- stepnumber
- duration of each image in a sprite
- heightnumber
- height of a image in a sprite
- widthnumber
- width of a image in a sprite
- widenumber
- width of sprite
- themeobject
-
- progressbarstring
- CSS class .progressbar-color-XXX called on the progressbar
- rangestring
- CSS class .vc-player.hover >.videocontrols >.videocontrols-seeker >.videocontrols-range:hover >.range-little-XXX called on the range
- volumestring
- CSS class .volumebar-color-XXX called on the volume
Methods
- fillscreenToggle
- toggle the fill screen
- fullscreenToggle
- toggle the full screen
- mediumscreenToggle
- toggle the medium screen
- playToggle
- play/pause the video
Events
- durationchange
- called when duration of the video change
- end
- called when the video is at end
- fillscreenchange
- called when fill screen change
- fullscreenchange
- called when full screen change
- load
- called when plugin is loaded
- mediumscreenchange
- called when medium screen change
- pause
- called when the video is paused
- play
- called when the video is played
- seekchange
- called when the seeker change
- volumechange
- called when volume change
Code
<video id="myVideo_demo" width="100%" height="100%" controls="controls">
<source src="big_bunny_108p.mp4" type="video/mp4">
</video>
<script type="text/javascript">
$(document).ready(function ()
{
$('#myVideo_demo').videocontrols(
{
markers: [40, 84, 158, 194, 236, 272, 317, 344, 397, 447, 490, 580],
preview:
{
sprites: ['big_bunny_108p_preview.jpg'],
step: 10,
width: 200
},
theme:
{
progressbar: 'blue',
range: 'pink',
volume: 'pink'
}
});
});
</script>Credits
Demo movie from http://www.bigbuckbunny.org/
VideoControls liense is GPL v2 and is used for a better user experience on pornzR us
Archive file from GitHub
videocontrols-master (29.June.2015)