brandonaaron / jquery-cssHooks

Collection of cssHooks that work with jQuery 1.4.3+
Other
478 stars 80 forks source link

bgpos.js error in chrome #28

Closed hexydec closed 13 years ago

hexydec commented 13 years ago

The bgpos.js script produces "Uncaught Error: INVALID_STATE_ERR: DOM Exception 11" in Google Chrome when the page is sent as "application/xhtml+xml".

The problem is that the div that is created to test support for backgroundPositionX / Y is written in a format that creates a document fragment that cannot be parsed into an XML DOM tree. The solution is to create the element using the alternative creation method that is XML compatible.

Old Code (line 6): var $div = $('

');

Change to: var $div = $("

", {style: "background-position: 3px 5px;"});

hexydec commented 13 years ago

Hmm, it seems to have stripped the HTML out of my comment. How useful!! Well I am sure you will get the jist of the change, please email if you want clarification.

louisremi commented 13 years ago

Hi willearp,

Thank you for reporting this issue (surprisingly, the HTML wasn't stripped in the email github sent me). Could adding a closing tag to the original string fix the bug as well?

Lr

hexydec commented 13 years ago

Hi Louis,

I think jQuery uses HTML parsing to create the element with the original method, which is not allowed when running your page in XML mode, the method I have provided is created internally using document fragments. jQuery is quite relaxed on how the input tag is formed in both methods, but I think the distinction in how it is created internally is governed by how it is inputted into the API.

Interestingly Firefox did not have this error so must be a bit more relaxed on the not being allowed to insert parsed HTML into the DOM (Which means I have mucho jQuery code to update!). But the W3C make it clear that when it comes to XML it must be well formed, and is only parsed from a string into an XML tree when the document is loaded to check for well-formed-ness, after that point code can only be added by adding nodes to that tree, via document fragments.

This is the second application/xhtml+xml problem I have had today, Google Maps API will not load in this mode because they use document.write() to get another Javascript from their server!!

Will Earp

louisremi commented 13 years ago

I've asked the author of this plugin to look at this issue, meanwhile, you can also give a try at: https://github.com/louisremi/jquery.backgroundXY.js/blob/master/jquery.backgroundXY.js and see if it does any better.

Thanks.