HTML and CSS Reference
In-Depth Information
} else {
// If sending via the user's mobile isn't possible,
// send the message using a third-party web service
this.ajaxSend(this.recipient, this.message);
}
}
function ajaxSend(recipient, message){
// Send the SMS using a web-based SMS gateway via Ajax
}
}
var messageInst = new Message("my message!", "01234567891");
messageInst.sendSMS();
As you can see from Listing 2-3, no matter what the capability of the browser,
we can use object detection to ensure the user gets the same or similar
experience regardless of what the device is capable of.
Detecting these niche features using JavaScript can be quite easy. But what
about testing for CSS3 or HTML5 capabilities, and providing backward
compatibility for features such as CSS3 animations and 3D transforms?
A JavaScript library called Modernizr can help to facilitate this for you. It uses
the same object detection methods to detect the HTML/CSS/JavaScript
capabilities of the user's web browser.
It modifies the DOM (Document Object Model) by adding classes to the HTML
tag in order to provide hooks for your own CSS and JavaScript feature
detection. Figure 2-1 shows this in action on haz.io. This will be covered in more
detail in Chapter 7.
