Tutorial Detect Internet Explorer

by in , 0 

<script type="text/javascript">

if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { //test for MSIE x.x;
 var ieversion=new Number(RegExp.$1) // capture x.x portion and store as a number
 if (ieversion>=8)
  document.write("You're using IE8 or above")
 else if (ieversion>=7)
  document.write("You're using IE7.x")
 else if (ieversion>=6)
  document.write("You're using IE6.x")
 else if (ieversion>=5)
  document.write("You're using IE5.x")
}
else
 document.write("n/a")

</script>

Reference

Tutorial Default Arguments for Functions

by in , 0 

// Combiner of passed arguments and defaults (usable with any function)
Object.prototype.combine = function(_args){
  for(var i in this) {
    if(typeof _args[i] == "undefined") {
      _args[i] = this[i];
    }
  }
};

// Specific example function with defaults
function feedTheCat(args){
  var defaults = {
      'morning' : "nothing",
      'noon'    : "pork",
      'nite'    : "mouse"
  };
  defaults.combine(args);
}

// USAGE: only passing 2 of 3 arguments
feedTheCat({
  'morning': "milk", 
  'nite': "kitekat"
}); 

// Values would be: milk | pork | kitekat

Reference URL

Tutorial Current Page with JavaScript

by in , 0

This is like a replacement for PHP's SCRIPT_NAME with JavaScript.

location.href.split('/').pop();

For example with this URL:

http://css-tricks.com/examples/ScriptName/index.php

This code:

document.write( location.href.split('/').pop() );

Would write to the page: "index.php"

Reference URL

Tutorial CSS for when JavaScript is Enabled

by in , 0 

document.documentElement.className = "js"

This adds a class to the root <html>, so you could (for example) do something like hide a <div> only when JavaScript is enabled.

.js div#id { display: none; }

Tutorial Cookie Getter/Setter

by in , 0 

/**
 * Gets or sets cookies
 * @param name
 * @param value (null to delete or undefined to get)
 * @param options (domain, expire (in days))
 * @return value or true
 */
_.cookie = function(name, value, options)
{
    if (typeof value === "undefined") {
        var n, v,
            cookies = document.cookie.split(";");
        for (var i = 0; i < cookies.length; i++) {
            n = $.trim(cookies[i].substr(0,cookies[i].indexOf("=")));
            v = cookies[i].substr(cookies[i].indexOf("=")+1);
            if (n === name){
                return unescape(v);
            }
        }
    } else {
        options = options || {};
        if (!value) {
            value = "";
            options.expires = -365;
        } else {
            value = escape(value);
        }
        if (options.expires) {
            var d = new Date();
            d.setDate(d.getDate() + options.expires);
            value += "; expires=" + d.toUTCString();
        }
        if (options.domain) {
            value += "; domain=" + options.domain;
        }
        if (options.path) {
            value += "; path=" + options.path;
        }
        document.cookie = name + "=" + value;
    }
};

Reference URL

Tutorial Comments in JavaScript

by in , 0 

function doSomething() {

    /*
           This code by Chris Coyier
    */

    var i = 0;    // counter to be used later;

}

Comments in JavaScript can be between /* */ markings (useful for multiple line comments) or after // markings (for single lines only).

Tutorial Clear Field on Focus

by in , 0 

<input type="text" onfocus="if(this.value == 'value') { this.value = ''; }" value="value" />

Replace "value" with the default value. If the field is selected, the default value will go away. If the user has previously changed the field value, it'll be left alone.

Alternatively, use onfocus="this.value='';" to always clear the field.