So, I'm looking for a JS code that will check the current browser and then use a different background image accordingly.
Mainly for browsers like Flock and etc. that aren't yet CSS3 friendly (background-size:cover; etc.)
I'm not looking for an alternative to CSS3, because, well, I like it! Just a way to check if the current browser is CSS3 friendly.
I just started reading an article about Object Detection (http://www.quirksmode.org/js/support.html). Seems like a better alternative to browser detection. However, how do I use JS to check if the browser supports a CSS3 statement???
Okay so now I've found some JS that detects css3/html5 capabilities (http://www.aryweb.nl/projects/mooModernizr/). My only problem is I need some help figuring out how to use the JS. I'm very new to JS!
First you need to go to http://mootools.net/download/get/mootools-1.2.4-core-yc.js and save the contents as a .js file as you will need mootools in order for this detection script to work.
Next you will need to also save the contents of http://www.aryweb.nl/projects/mooModernizr/mooModernizr-min.js as a .js file then do the following...
NOTE: Only the options in the
List of CSS3/HTML5 feature tests
can be used. Anything else not in the list will return undefined.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />