The company I work for is using jquery uniform on two of their sites, which mind you has not been updated for almost a year. Removing it is not a quick viable option as we would lose the current formatting of all form elements across the site and I would have to fix them all. There doesn’t seem to be a note on the jquery.uniform.js site as to when they will update the uniform library. I just pulled my hair out for hours trying to get a couple select boxes to be “uniform” across all browsers due to this code being out-of-date…with IE 11 being the most problematic. The main issue being that IE 11 now tells us in the navigator object that it is actually mozilla. Thanks guys, that’s useful. I found an excellent hack on stackoverflow that does in fact work. This was one of about 10 hurdles I had to jump through, but was by far the most annoying one.
http://stackoverflow.com/questions/18684099/jquery-fail-to-detect-ie-11
I ended up having to use several css and jquery hacks including using setTimeout to deal with a race condition. document.ready was not enough to ensure that my code executed last, even in the footer. my guess is uniform.js was taking longer to load and adjust elements than my js.
My CSS changes were as follows to accommodate Firefox:
#billinginfo select {
width: 160px;
}
@-moz-document url-prefix() {
#billinginfo select {
width: 185px;
}
}
And this was the javascript I used in the footer:
$(document).ready(function() {
setTimeout(function() {
if (navigator.appVersion.indexOf("Win")!=-1) {
if($.browser.mozilla) {
$('#billinginfo div.selector span').css('padding','0 0 0 4px','important');
}
if (!!navigator.userAgent.match(/Trident\/7\./)) {
$('#billinginfo div.selector span').css('padding','0 0 0 27px','important');
}
}
}, 1000);
});