Questions tagged [modernizr]

Modernizr is an open-source JavaScript library that helps you build the next generation of HTML5 and CSS3-powered websites.

Modernizr is a small JavaScript library that detects the availability of native implementations for next-generation web technologies, most commonly features that stem from the HTML5 and CSS3 specifications. Many of these features are already implemented in at least one major browser (most of them in two or more). Modernizr tells you whether the current browser has this feature natively implemented or not.

The most recent version of Modernizr is Modernizr 2.5, released 6 Feb 2012. More information is available at the Modernizr home page.

When Modernizr v2 was released in June 2011, it made a significant departure from v1 (and from most other common JavaScript libraries): Where version 1 included all the feature detection tests in a single standard script, version 2 allows a site developer to build their own personalized copy of Modernizr that contains only the tests required. This allows a developer to minimize the amount of JavaScript code that their users need to download. However, it also reduces the scope to use a shared content delivery network (CDN) such as Google Code.

902 questions
21
votes
2 answers

Modernizr position fixed test incomplete

Modernizr is great but the example test for position: fixed is quite incomplete: iOS 4 and lower returns true while it doesn't support position: fixed Opera on Windows returns false while it does support position: fixed I found another test based…
DADU
  • 6,482
  • 7
  • 42
  • 64
21
votes
2 answers

Are Modern browsers loading scripts parallel or sequentially?

I'm evaluating existing resources for script loading optimization, but I readed in some articles like this, refers to the older browsers block other downloads until this sequential script loading phase is completed. I check Modernizr(yepnope.js),…
smoreno
  • 3,129
  • 3
  • 32
  • 49
20
votes
1 answer

What is causing my scripts to be requested twice while using Modernizr.load (yepnope.js)

I am using yepnope.js to load javascript files dynamically,and I've noticed that my scripts appear to be loaded twice according to Firebug and Webkit Inspector. The problem is that in Firebug's Net panel (Firefox 4 latest), their response is a 200,…
Phil Ricketts
  • 8,236
  • 3
  • 28
  • 31
20
votes
1 answer

JavaScript function with 'undefined' parameter

Going around Modernizr source code I have found strange thing: window.Modernizr = (function(window,document,undefined) { After that this function will be called with two arguments (this, this.document). Why undefined is used here? Is it meaningful…
Gleb M Borisov
  • 617
  • 3
  • 10
20
votes
2 answers

Angular 2: Check whether user's browser is compatible

I'm writing an Angular 2 app but am conscious that some users may not be using a browser that can support Angular 2. I have a check for whether Javascript is enabled, I am more interested in whether the user's browser doesn't support certain…
Harry
  • 3,312
  • 4
  • 34
  • 39
19
votes
7 answers

Detect support for background-attachment: fixed?

Is there a way to detect browser support for background-attachment: fixed? Edit: Although this feature is widely supported on desktop browsers it is poorly supported on portable devices which I why I would like to be able to detect the feature.
Malcr001
  • 8,179
  • 9
  • 44
  • 57
17
votes
2 answers

How to detect if Media Queries are present using Modernizr

I'm trying to detect whether media queries are present using Modernizr 2, then loading in respond.js if appropriate. I've put this in my script.js file... Modernizr.load({ test: Modernizr.mq, yep : '', nope: 'mylibs/respond.js' }); What am I…
SparrwHawk
  • 13,581
  • 22
  • 61
  • 91
17
votes
1 answer

Detecting geo-uri-support

Is there a way with JavaScript to check whether the client-browser supports the GEO-URI-scheme? I want to show a coordinate for nonsupported browsers as a link to a map Berlin and for…
16
votes
1 answer

Bower and Modernizr

I'm aware that I can create a custom build build of Modernizr to detect the features I care about. But is there a way to use Modernizr installed with Bower to detect a specific feature or set of features (such as SVG support) without including the…
Dennis Best
  • 3,614
  • 3
  • 20
  • 31
15
votes
5 answers

getUserMedia - how to detect if the device actually has a camera

I'm playing with the html5/javascript getUserMedia api to write a js app that will use the device's camera if available. I'm using Modernizr to detect the capability (of the browser) like this: if (Modernizr.getusermedia) { And within the true…
Nathan Russell
  • 3,428
  • 5
  • 30
  • 51
14
votes
3 answers

CSS3 animation-fill-mode polyfill

Preface Let's pretend that a div is animated from opacity:0; to opacity:1; and i want to keep opacity:1; after the animation ends. That's what animation-fill-mode:forwards; does. @keyframes myAnimation { from { opacity:0; } to { opacity:1;…
Giona
  • 20,734
  • 4
  • 56
  • 68
13
votes
3 answers

Remove all hover effects through css

When I come down on touch devices I don't want the hover behavior. Is it possible to disable all hover effects at once for a whole website? Given that you use Modernizr to detect touch and set the class. This is what I came up with but it gives a…
Simon Dragsbæk
  • 2,367
  • 3
  • 30
  • 53
13
votes
2 answers

Angular expressions with Modernizr values?

I would like to show different controls if there is no html 5 native browser support for the new input types. I was hoping to do something like this:

Modernizr says datetime-local is…

JohnC
  • 3,938
  • 7
  • 41
  • 48
13
votes
1 answer

Include Modernizr in RequireJS and have the Modernizr in the head tags

I have a problem with RequireJS and Modernizr. I want the Modernizr resource to be on the head. And everything else in the body. The reason is that Modernizr need to do some stuffs before DOMContentLoad. I want to be able to load the Modernizr…
einstein
  • 13,389
  • 27
  • 80
  • 110
13
votes
1 answer

How to test for Touch-Events now that Chrome fails standard tests?

I used to rely on var supportsTouch = 'ontouchstart' in document; to test for touch support in mobile and desktop browsers. Based on that test I bind eventListeners to click- or touch-events. This works fine in ALL current browser versions but the…
Jörn Berkefeld
  • 2,540
  • 20
  • 31
1
2
3
60 61