03.22.2010

JQuery Browser Detection

JQuery Browser Detection

We’ve all come across that issue when optimizing our sites for all browsers (ie, ff, safari, etc.).  Well, now with the JQuery browser detection plugin, we don’t have to create a new external style sheet anymore.  By using the technique below, you can easily create focused style corrections in just a few lines of javascript.  Of course, don’t forget to call the javascript library in your document header.

In your document header, place the following code + the appropriate styling modifications :


examples


//A. Target Safari
if( $.browser.safari ) $(”#menu li a”).css(“padding”, “1em 1.2em” );

//B. Target anything above IE6
if ($.browser.msie && $.browser.version > 6 ) $(”#menu li a”).css(“padding”, “1em 1.8em” );

//C. Target IE6 and below
if ($.browser.msie && $.browser.version <= 6 ) $("#menu li a").css("padding", "1em 1.8em" );

//D. Target Firefox 2 and above
if ($.browser.mozilla && $.browser.version >= “1.8” ) $(”#menu li a”).css(“padding”, “1em 1.8em” );




Credits :
CatsWhoCode.com



View all plugins


Next Plug-in