saria

Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.

online javascript editor, testing javascript online, online ide, online code editor, html, css, coffeescript, scss online editor

JSFiddle

Run

Save

Update

Fork

Tidy

Collaborate

• Embed

  Tabs:

  JavaScript HTML CSS Result

  Visual:

  Light Dark

  Embed code Prefer iframe?:

  <script async src="{embedSrc}"></script>

  <iframe width="100%" height="300" src="{embedSrc}" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

  No autoresizing to fit the code

  Render blocking of the parent page

• Your fiddle has an unsaved draft

  Diff between the saved and locally drafted fiddle:

  Apply local draft version or discard it

• Settings

  Auto-close HTML tags

  Show line numbers

  Enable line wrapping

  Indent with tabs

  Indent size:

  2 spaces 3 spaces 4 spaces

  Key map:

  Default Sublime Text VIM EMACS
• Sign in

Fiddle Author

ramp

Fiddle Meta

Add title to make the fiddle public.

External Resources 5

• popcorn.js
• theme.mp2.css
• jquery.iecors.js
• jwplayer.js
• metaplayer-complete.js

AJAX Requests

/echo simulates AJAX calls:
JSON: /echo/json/
JSONP: //jsfiddle.net/echo/jsonp/
HTML: /echo/html/
XML: /echo/xml/

See docs for more info.

Legal, Credits and Links

Hosted by DigitalOcean

License

All code belongs to the poster and no license is enforced.

JSFiddle or its authors are not responsible or liable for any loss or damage of any kind during the usage of provided code.

Links

Docs

<h3>MetaPlayer &raquo; Examples &raquo; JWPlayer with v3 UI</h3> <div class="container"> <div class="metaplayer"> <div id='target'></div> </div> <div id='searchbar'></div> <div id='transcript'></div> </div> HTML

var jwp, video, player; $(function () { jwp = jwplayer('target').setup({ controls: false, // v6 controlbar: "none", //v5 width: "600", height: "300", autostart: true, icons: false, // disable a big play button on the middle of screen plugins: { viral: { onpause: false, oncomplete: false, allowmenu: false } }, // disable all viral features. flashplayer: " ", file: "https://googledrive.com/host/0B9XJxML9RvoSbXpGdmdLUnUzbUE/youngmon2.mp4" }); jwp.onReady(function () { video = MetaPlayer.jwplayer(jwp); video.autoplay = true; player = MetaPlayer(video) .controlbar({ fullscreen: true }) .captionconfig() .transcript("#transcript") .searchbar("#searchbar") .mrss("//publishing.ramp.com/FileResource/widgets/metaplayer3/examples/data/elephants.mrss.xxml") .srt() .load(); }); }); JavaScript

h3 { color: #101010; font-family: Helvetica, Arial, sans-serif; margin: 20px; font-size: 20px; } .container { position: relative; } .metaplayer { width: 600px; height: 300px; outline: 1px solid red; } #transcript { margin-top: 10px; outline: 1px solid black; width: 600px; height: 100px; } #searchbar { outline: 1px solid black; width: 600px; } CSS

Language

HTML

Doctype

XHTML 1.0 Strict XHTML 1.0 Transitional HTML 5 HTML 4.01 Strict HTML 4.01 Transitional HTML 4.01 Frameset

Body tag

Language

JavaScript CoffeeScript JavaScript 1.7 Babel TypeScript

Frameworks & Extensions

Mootools (nightly) Mootools 1.5.2 (nocompat) Mootools 1.5.2 Mootools 1.5.1 Mootools 1.5.0 Mootools 1.4.5 (compat) Mootools 1.4.5 Mootools 1.3.2 (compat) Mootools 1.3.2 Mootools 1.2.6 jQuery (edge) jQuery 3.0.0-alpha1 jQuery 2.1.4 jQuery 2.1.3 jQuery 2.1.0 jQuery 2.0.2 jQuery 1.11.0 jQuery 1.10.1 jQuery 1.9.1 jQuery 1.8.3 jQuery 1.7.2 jQuery 1.6.4 Prototype 1.7.3 Prototype 1.7.2 Prototype 1.7.1 Prototype 1.6.1.0 YUI 3.17.2 YUI 3.16.0 YUI 3.14.0 YUI 3.10.1 YUI 3.8.0 YUI 3.7.3 YUI 3.6.0 YUI 3.5.0 YUI 2.8.0r4 No-Library (pure JS) Dojo (nightly) Dojo 1.10.4 Dojo 1.9.7 Dojo 1.8.10 Dojo 1.7.8 Dojo 1.6.2 Dojo 1.5.3 Processing.js 1.4.7 Processing.js 1.4.1 Processing.js 1.3.6 Processing.js 1.2.3 ExtJS 5.1.0 ExtJS 5.0.0 ExtJS 4.2.0 ExtJS 4.1.1 ExtJS 4.1.0 ExtJS 3.4.0 ExtJS 3.1.0 Raphael 2.1.0 Raphael 1.5.2 (min) Raphael 1.4 RightJS 2.3.1 RightJS 2.1.1 Three.js r54 Zepto 1.0rc1 Enyo (nightly) Enyo 2.5.1 Enyo 2.4.0 Enyo 2.2.0 Enyo 2.1 Enyo 2.0.1 Shipyard (nightly) Shipyard 0.2 Knockout.js 3.4.0 Knockout.js 3.0.0 Knockout.js 2.3.0 Knockout.js 2.2.1 Knockout.js 2.1.0 Knockout.js 2.0.0 The X Toolkit edge AngularJS 2.0.0-alpha.47 AngularJS 1.4.8 AngularJS 1.2.1 AngularJS 1.1.1 Ember (latest) Underscore 1.8.3 Underscore 1.4.4 Underscore 1.4.3 Underscore 1.3.3 Bonsai 0.4.1 KineticJS 4.3.1 KineticJS 4.0.5 FabricJS 1.5.0 FabricJS 1.4.0 FabricJS 1.2.0 FabricJS 0.9 qooxdoo 2.1 qooxdoo 2.0.3 D3 3.x CreateJS 2015.05.21 CreateJS 2013.09.25 WebApp Install 0.1 Thorax 2.0.0rc6 Thorax 2.0.0rc3 Paper.js 0.22 React 0.14.3 React 0.9.0 React 0.8.0 React 0.4.0 React 0.3.2 svg.js 2.1.1 Minified 1.0 beta1 jTypes 2.1.0 Lo-Dash 2.2.1 Brick edge RactiveJS 0.7.3 Vue (edge) Vue 1.0.12 JSBlocks (edge) OpenUI5 (latest, mobile) MithrilJS 0.2.0

• jQuery UI 1.8.18
• jQuery Lint (13 June '11)
• Bootstrap 2.0.2 (js only)
• jQuery Mobile 1.1.1

Load type

onLoad onDomready No wrap - in <head> No wrap - in <body>

Framework <script> attribute

Language

CSS SCSS

Options

Normalized CSS