Skip to content

aFarkas/webshim

Folders and files

NameName
Last commit message
Last commit date

Latest commit

author
alexander.farkas
Nov 13, 2016
1600cc6 · Nov 13, 2016
Jul 29, 2014
Nov 13, 2016
Jan 28, 2014
Nov 13, 2016
Nov 13, 2016
Aug 14, 2014
Sep 15, 2014
Jul 5, 2014
Jan 17, 2014
Sep 11, 2014
Oct 21, 2010
Nov 13, 2016
Nov 13, 2016
Sep 12, 2015
Sep 12, 2015
Nov 13, 2016
Jul 22, 2015
Nov 13, 2016

Repository files navigation

Important note: Webshim is not compatible with upcoming jQuery 3.x and I do not plan to work on a new major version. I will still fix critical bugs in the future though.

The polyfilling, capability based loading JavaScript Library

General Principles

  • HTML5 compliant: correctly and accurately implemented (HTML5) Markup-, JS- and DOM-APIs
  • capability based loading: extremely lightweight in modern browsers
  • cross-browser support: All A-Graded browsers including latest version of Opera are tested
  • extendable: if we have not implemented a feature you want, you can easily implement it on your own

Features

  • canvas
  • HTML5 form features including: constraint validation and form widgets (input[type="range"], input[type="date"], input[type="number"], input[type="time"], input[type="month"], output, progress, input[list]/datalist)
  • HTML5 audio/video/track implementation
  • matchMedia
  • interactive elements: summary/details
  • XHR2 / filereader (including, XHR2/AJAX CORS and FormData handling)
  • picture / img[srcset]
  • promise
  • geolocation
  • ECMAScript 5 / JavaScript 1.8.5 features
  • window.URL
  • getUserMedia ('usermedia' currently only access to user's camera, not microphone)
  • sticky (position: sticky)

Installation and Usage

1 - Download the Webshim Lib and put the js-webshim folder in your project.

2 - Include the JavaScript:

<script src="js/jquery.js"></script>

<script src="js-webshim/minified/polyfiller.js"></script> 

<script> 
	// load and implement all unsupported features 
	webshims.polyfill();
		
	// or only load a specific feature
	//webshims.polyfill('forms es5');
</script>

3 - Wait till everything has been loaded and then use it:

<script> 
	$(function(){
		// work with the HTML5 API
		$('input:invalid').each(function(){
		    $(this).after( $.prop(this, 'validationMessage') );
		});
		// ...
	});
</script>

More information and demos.

Download via bower

bower install webshim --save-dev

License

The Webshims Lib core is licensed under the MIT-License.

Webshims Lib uses many great third party scripts:

Script License URL
flashcanvas MIT http://code.google.com/p/flashcanvas
flashcanvaspro closed http://flashcanvas.net
Jaris FLV GPL 3.0 http://jarisflvplayer.org
excanvas Apache License 2.0 http://excanvas.sourceforge.net
moxie GPL 3.0 https://github.com/moxiecode/moxie
es5 MIT https://github.com/280north/narwhal
swfmini MIT https://code.google.com/p/swfobject
track BSD 2 clause https://github.com/cgiffard/Captionator
color-picker MIT http://johndyer.name/post/2007/09/PhotoShop-like-JavaScript-Color-Picker.aspx
forms-picker MIT https://github.com/brandonaaron/jquery-mousewheel
jme.woff GPL / CC BY 3.0 http://icomoon.io/#preview-free
picture MIT https://github.com/scottjehl/picturefill
url any (OSI approved) Open Source licence https://github.com/inexorabletash/polyfill

Questions?

If you have any questions, please feel free to ask them on stackoverflow.com/questions/tagged/webshim.

Please tag your questions with 'webshim'.