/* Author: 
Copyright 2011 Nicholas C. Zakas. All rights reserved.
Licensed under BSD License.
     
This function determines if the browser is currently in a particular media
media mode. Use the same media query as you would in CSS or on a <link>
element. 

The theory is the same as many CSS detection techniques:
1. Create a hidden <div> with a specific ID.
2. Add a <style> element with a media query.
3. See if the style was applied to the div. 

The function accepts a single argument, the media query string, and returns true
if the browser is currently in the given media mode or false if not. Note that
this is limited to the browser's support for CSS media queries. IE < 9, for
example only supports simple media types like "screen" and "print", so any
advanced queries will always return false. For this reason, this method's
purpose is to determine if the given browser understands the media query AND
the media mode is active.

This function works back through IE6.
*/

var isMedia = (function(){

		var div;

		return function(query){
		if (!div){
		div = document.createElement("div");
		div.id = "ncz1";
		div.style.cssText = "position:absolute;top:-1000px";
		document.body.insertBefore(div, document.body.firstChild);			
		}

		div.innerHTML = "_<style media=\"" + query + "\"> #ncz1 { width: 1px; }</style>";
		div.removeChild(div.firstChild);
		return div.offsetWidth == 1;	
		};
})();

/*
    Simple usage, just pass in a CSS media query.

if (isMedia("screen and (max-width:480px)")) {
		alert('hello');

};
*/