JavaScript is a prototype-based scripting language that is dynamic, weakly typed and has first-class functions. It is a multi-paradigm language, supporting object-oriented, imperative, and functional programming styles....
library that detects the availability of native implementations for next-generation Web Technologies. These technologies are new features that stem from the ongoing HTML5 and CSS 3 specifications.
Overview
Many of the features (technologies from HTML5 and CSS 3) are already implemented in at least one major browser
Web browser
A web browser is a software application for retrieving, presenting, and traversing information resources on the World Wide Web. An information resource is identified by a Uniform Resource Identifier and may be a web page, image, video, or other piece of content...
. Modernizr tells you whether the current browser has implemented a given feature. This lets developers take advantage of the new features in the browsers that support them, yet create a fallback in the browsers that lack support for that feature.
In computing, a user agent is a client application implementing a network protocol used in communications within a client–server distributed computing system...
In computer vision and image processing the concept of feature detection refers to methods that aim at computing abstractions of image information and making local decisions at every image point whether there is an image feature of a given type at that point or not...
, to discern what a browser can and cannot do. It uses both (rather than just the user agent) since the same rendering engine may not necessarily support the same things in two different browsers using that engine. In addition, some users change their user agent string to get around websites that block features for browsers with specific user agent settings.
Modernizr tests for over 40 next-generation features, then creates a JavaScript
JavaScript
JavaScript is a prototype-based scripting language that is dynamic, weakly typed and has first-class functions. It is a multi-paradigm language, supporting object-oriented, imperative, and functional programming styles....
object (named "Modernizr") that contains the results of these tests as boolean
Boolean
Boolean may refer to:* Boolean algebra, a logical calculus of truth values or set membership* Boolean algebra , a set with operations resembling logical ones* Boolean data type, a certain datatype in computer science...
HyperText Markup Language is the predominant markup language for web pages. HTML elements are the basic building-blocks of webpages....
element based on what features are and are not natively supported.
Tests
To perform feature detection tests, Modernizr often creates an element, sets a specific style instruction on that element and then immediately tries to retrieve that setting. Web browser
Web browser
A web browser is a software application for retrieving, presenting, and traversing information resources on the World Wide Web. An information resource is identified by a Uniform Resource Identifier and may be a web page, image, video, or other piece of content...
s that understand the instruction will return something sensible; browsers that don't understand it will return nothing or "undefined". Modernizr uses the result to assess whether that feature is supported by the web browser.
Many tests in the documentation come with a small code sample to illustrate how you could use that specific test in your web development workflow
Workflow
A workflow consists of a sequence of connected steps. It is a depiction of a sequence of operations, declared as work of a person, a group of persons, an organization of staff, or one or more simple or complex mechanisms. Workflow may be seen as any abstraction of real work...
.
Running
Modernizr runs automatically. There is no modernizr_init function to call. When it runs, it creates a global object called Modernizr that contains a set of Boolean properties for each feature it can detect. For example, if your browser supports the canvas API,the Modernizr.canvas property will be true. If your browser does not support the canvas API, the Modernizr.canvas property will be false:
if (Modernizr.canvas)
{
// let's draw some shapes!
} else
{
// no native canvas support available :(
}
In engineering, a function is interpreted as a specific process, action or task that a system is able to perform .-In engineering design:In the lifecycle of engineering projects, there are usually distinguished subsequently: Requirements and Functional specification documents. The Requirements...
to browsers; it detects native availability of features.
In computer vision and image processing the concept of feature detection refers to methods that aim at computing abstractions of image information and making local decisions at every image point whether there is an image feature of a given type at that point or not...
HTML5Shiv is a JavaScript workaround to enable HTML5 elements in versions of Internet Explorer before version 9 that do not support elements that are not recognized, thus allowing them to be styled by CSS...
HTML5 File API aspect provides an API for representing file objects in web applications and programmatic selection and accessing their data. In addition, this specification defines objects to be used within threaded web applications for the synchronous reading of files...
HTML5 provides mobile device users richer web applications and improved usability. The new features of HTML5 standardize the use cases and technologies that are common in smartphone-optimized mobile web applications. In today’s Mobile Web of WML or XHTML-MP or HTML 4 documents, these features are...
JavaScript is a prototype-based scripting language that is dynamic, weakly typed and has first-class functions. It is a multi-paradigm language, supporting object-oriented, imperative, and functional programming styles....
Web Workers define an API for running scripts, basically JavaScript, in the background independently of any user interface scripts. This allows for long-running scripts that are not interrupted by scripts that respond to clicks or other user interactions, and allows long tasks to be executed...
WebGL is a software library that extends the capability of the JavaScript programming language to allow it to generate interactive 3D graphics within any compatible web browser...
