Slideshow examples of the differences between mootools, jquery, and prototype

1. Refresh Detroit JavaScript Libraries Chris J. Lee of Holy MoLee Photography & 3.7 Designs

2. Refresh Detroit Browser Sniffing – Why Regular Javascript Smells Bad JavaScript Libraries http://www.webreference.com/tools/browser/javascript.html MooTools – Sniffs out By Extending the Window Class window.ie will be set to true if the current browser is internet explorer (any). window.ie6 will be set to true if the current browser is internet explorer 6. window.ie7 will be set to true if the current browser is internet explorer 7. window.gecko will be set to true if the current browser is Mozilla/Gecko. window.webkit will be set to true if the current browser is Safari/Konqueror. window.webkit419 will be set to true if the current browser is Safari2 / webkit till version 419. window.webkit420 will be set to true if the current browser is Safari3 (Webkit SVN Build) / webkit over version 419. window.opera is set to true by opera itself.

3. Refresh Detroit Browser Sniffing – Why Regular Javascript Smells Bad JavaScript Libraries JQuery – Created $.browser Object $.browser.msie will be set to true if the current browser is internet explorer (any). $.browser.mozilla will be set to true if the current browser is Mozilla/Gecko. $.browser.safari will be set to true if the current browser is Safari/Konqueror. $.browser.opera is set to true by opera itself.

4. Refresh Detroit Browser Sniffing – Why Regular Javascript Smells Bad JavaScript Libraries Prototype ? – No Official Browser Sniffing Solutions? Couple it with JQuery

5. Refresh Detroit Selectors – For the impatient & lazy JavaScript Libraries Wheres your ID?! Prototype - $(“div1, div2 ”); MooTools - $(“div1, div2”); Jquery - $(“div1, div2”); What if I need a class? Prototype - $$(“div1, div2 ”); MooTools - $$(“#div1, .div2”); - Returns Array Jquery - $(“.div”); Custom Selectors Jquery - $(“:first”); $(“:hidden”); $(“:visible”); XPath - $(“/body/div/p) Attributes - "input[@type='checkbox']"

6. Refresh Detroit Events – Clickity Click! JavaScript Libraries Clicks Prototype - Event.observe('mydiv', 'click', function(e){ alert('Event Fired') }); MooTools - $(“div1”).addEvent(“click”, function() {alert(“Event Fired”); Jquery - $(“.clickme”).bind(“click”, function() { alert(“Event Fired”); }

7. 3point7designs.com/ HolyMoLeePhoto.com/