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
9
votes
2 answers

html5 input type number: detect whether spinbox or not (and no other features)

In Webkit browsers, an input[type=number] has a spinbox control: However, Safari does not follow some other input[type=number] rules, like enforcing that only numeric characters are entered. Hence, Modernizr detects that Safari does not support…
chadoh
  • 4,343
  • 6
  • 39
  • 64
9
votes
2 answers

Prevent page scrolling when scrolling a DIV while resolving [Violation] warning in console

At first this seems to be duplicate question answered here but there is more that need to be figured out. How can I resolve below given [Violation] warning in google chrome console? [Violation] Added non-passive event listener to a…
Syed
  • 15,657
  • 13
  • 120
  • 154
9
votes
2 answers

Testing of CSS "mix-blend-mode"

I want to use CSS's property : mix-blend-mode: soft-light; And I will test by Modernizr for fallback bla bla... Tested : Modernizr.mixblendmode //undefined Modernizr.testProp('mixblendmode'); //false Modernizr.addTest('mixblendmode'); //…
l2aelba
  • 21,591
  • 22
  • 102
  • 138
9
votes
1 answer

Android 4.1.1/4.1.2 Date Picker Galaxy S3

I'm using According to caniuse.com android browser does not support this yet. Although I look at the the page on the HTC One 4.1.x, which has its own native rendering for the input field. Samsung Galaxy S3 4.1.2 has a rendering…
mike james
  • 8,840
  • 3
  • 18
  • 21
9
votes
1 answer

Modernizr reporting laptop as touch device in Chrome and FF

Bit of a weird one. I have a site I am working on. But, on my laptop (ASUS Zenbook) some of the features do not work. We spent a good amount of time using Firebug to try and get it working/work out what it was, with no joy! I then noticed that these…
jamesmhaley
  • 44,484
  • 11
  • 36
  • 49
9
votes
2 answers

how would I detect if "multiple" attribute is supported for file input elements?

Internet Explorer does not support the multiple attribute for . However, its not only IE that lacks this support... also certain mobile browsers do not support the multiple attribute. So simply detecting that the browser is IE…
Hristo
  • 45,559
  • 65
  • 163
  • 230
8
votes
3 answers

Determine whether browser supports printing

I think the answer to this is almost certainly "no", because I've done a little testing and searching around, but is there any trick to detect whether window.print() even might work from inside a page (i.e., from JavaScript)? I know that even on a…
Pointy
  • 405,095
  • 59
  • 585
  • 614
8
votes
4 answers

Is it possible to check if cookies are enabled with modernizr?

I was researching about how to check if the cookies are enabled in a browser and i found a lot of answer, i even tested a few ones, but after that a friend of mine suggest me to use Modernizr for that. I started to search about that and i found a…
ddieppa
  • 5,866
  • 7
  • 30
  • 40
8
votes
6 answers

Support 'background-size' property on older browsers?

Is there a way that I can use the CSS3 'Background-Size' property and then use something like Modernizr to ensure that it's supported in older browsers (in particular I want to use 'background-size: cover' option)? I took a look at cssFx, which is…
Yorkshire Bear
  • 153
  • 1
  • 4
  • 10
8
votes
1 answer

Feature detect if user gesture is needed

is there a way to detect if calling play() on a video element is allowed without a user gesture? On Android Chrome this warning is given: Failed to execute 'play' on 'HTMLMediaElement': API can only be initiated by a user gesture. So on Chrome…
oskbor
  • 1,592
  • 18
  • 35
8
votes
2 answers

How can I test for clip-path support?

clip-path:shape() does not seem to work in IE (no surprise) and Firefox (a bit surprised). Is there a way to test for clip-path support? I use modernizr. (By the way, I know I can get this to work using SVGs and -webkit-clip-path:url(#mySVG))
user1214678
8
votes
1 answer

Modernizr getusermedia undefined

I am confused why Modernizr.getusermedia is undefined, but when I type in !!navigator.webkitGetUserMedia it returns true. I am using Chrome and I know webrtc is supported... so why does Modernizr say its undefined. The Modernizr that I downloaded…
Jupiter
  • 238
  • 1
  • 2
  • 11
8
votes
6 answers

How to disable javascript for responsive design

I have been using supersized jQuery for the slideshow background of my website. I am making the website responsive and using css media queries. I would like to be able to disable the script when it is below 480px. Here is the script for the actual…
Suzi Larsen
  • 1,420
  • 5
  • 18
  • 32
7
votes
1 answer

Modernizr not applying classes to html-tag

I'm building a website at the moment, where I need the use of Modernizr, but for some reason it doesn't apply the classes to the html-tag as it should.. My code looks like this: