YUI3 selector problem in ie8 - internet-explorer-8

Y.one('form fieldset:nth-child(2)').toggleClass('hide');
in chrome, FF, opera this line works but in ie6-8 it throws an error
'Y.one(...)' is null or not an object.
where is the problem?

Have to add the "selector-css3" module to your .use() statement if you want to use CSS3 selectors in browsers that don't support them natively.

Related

Modernizr.videoautoplay object shows true, Modernizr.videoautoplay returning undefined

I'm using a custom Modernizr build, v3.3.0. I've created a simple JSFiddle example to illustrate: https://jsfiddle.net/cqkg7x45/6/.
console.log(Modernizr);
will show the Modernizr object, and when I inspect it in the JS console I can see "videoautoplay" is a property with a value of "true".
But, when I do
console.log(Modernizr.videoautoplay)
it returns "undefined".
I was originally seeing this issue in a WordPress theme I'm developing, but was also able to recreate in JSFiddle and a separate stand-alone HTML page. Also, Modernizr is putting the "videoautoplay" class on my HTML tag, even when I know the device does not support that feature (iPhone 5).
Update: This issue appears to be happening in Chrome (v47.0.2526.106), but not Firefox (v43.0.2).
I'm going to answer my own question in case anyone else runs into this problem. I found the solution on this SO post: How do I detect if the HTML5 autoplay attribute is supported?.
Since this is an "async" test you can't access the property using the syntax
Modernizr.videoautoplay
You have to use the .on() function, as shown in the above SO post:
Modernizr.on('videoautoplay', function(result){
if(result) {
alert('video autoplay is supported');
} else {
alert('video autplay is NOT supported');
}
});

I have History.js problems in IE8

It seems that there's a problem with the way History.js is instantiated, but I'm unsure even about that. On window load, this code (among others) is called:
History.Adapter.bind(window, 'anchorchange', function(event){
and for this code on IE8 I get: Unable to get value of the property 'Adapter': object is null or undefined.
You can see the page at skrobotwp.gandzo.com, everything works fine in newer browsers.

Getting Modernizr.mq working in IE 8

I'm using Modernizr.mq(http://modernizr.com/docs/#mq) to run checks in my JS, and I was under the impression that the Respond polyfill would make Modernizr.mq work in IE 8 as IE 8 does not support media queries but this isn't the case, see this test page in IE 8: http://goo.gl/ND9sA, the bg should be orange according to this:
if (Modernizr.mq('screen and (min-width: 650px)')) {
$('body').css('background', 'orange');
}
So does Respond only work for media queries specified within CSS and not JS? I thought Modernizr.mq uses matchMedia and Respond includes the matchMedia polyfill but still doesn't work.
So how do you get Modernizr.mq working for IE 8 or can't you?
Modernizr doesn't change the values of its tests if you load polyfills, so if the browser doesn't support media queries, Modernizr.mq() will return false, and adding the Respondjs polyfill won't change that.
Sorry about that.
Having said that, if you've got the polyfill loaded, then you're already doing all you can to support old browsers (Respondjs supports IE6/7/8), so there's not a huge amount more you can achieve with the Modernizr flag. , You theoretically shouldn't need to use the Modernizr test with the polyfill in place, as all browsers should support the feature anyway.

Pausing HTML 5 video in Safari 5.1.7 for Windows

I'm trying to pause every instance of an HTML 5 <video> tag on a page after an event is fired using:
jQuery("video").each (function() { this.pause(); })
Works in all browsers EXCEPT Safari for Windows 5.1.7, which throws:
TypeError: 'undefined' is not a function (evaluating 'this.pause()')
Why do Safari throws this exception and how can I avoid it?
edit:
so, given you are using video.js, maybe something like this?
jQuery("video").each (function() {
_V_($(this).id).pause(); //make sure all your video tags have an id attribute
});
https://github.com/zencoder/video-js/blob/master/docs/api.md

Strange error with canvas context getImageData function in Firefox 13

I have some canvas code that works great in safari and chrome, but fails in firefox.
The firefox console reads:
[17:44:13.372] uncaught exception: [Exception... "Operation is not supported" code: "9" nsresult: "0x80530009 (NotSupportedError)" location: "http://REDACTED.js Line: 703"]
Firebug gives the slightly-more-useful-to-humans:
Operation is not supported
var data = ctx.getImageData(x,y,1,1);
I am indeed calling .getImageData on line 703.
I have read that similar errors have been reported with regards to origin policies. This project is hosted on a web server (not local), and I haven't loaded any images from a different domain and put them on the canvas. In fact, I get the error even if the canvas is blank.
The webkit-based browsers give me the pixel data as asked, what can be done about firefox? Thanks.
Don't pass NaN to .getImageData.

Resources