23
writing Jake Trent

Writing Jquery Plugins

Embed Size (px)

Citation preview

Page 1: Writing Jquery Plugins

writing

Jake Trent

Page 2: Writing Jquery Plugins

jQuery.fn.debug = function() { /* ... */ alert(„debugging‟); /* ... */ };

$(“div”).debug();

Page 3: Writing Jquery Plugins
Page 4: Writing Jquery Plugins
Page 5: Writing Jquery Plugins
Page 6: Writing Jquery Plugins
Page 7: Writing Jquery Plugins
Page 8: Writing Jquery Plugins
Page 9: Writing Jquery Plugins
Page 10: Writing Jquery Plugins
Page 11: Writing Jquery Plugins

(function($) { $.fn.feed_the_pig = function() { /* ... */ }; })(jQuery);

Page 12: Writing Jquery Plugins

parameter, parameter, parameter, parameter);

limit(

Page 13: Writing Jquery Plugins

$.fn.invest = function(settings) { /* ... */ };

Page 14: Writing Jquery Plugins

$.fn.wield = function(settings) { var opts = { weapon: „nunchuck‟, skill_level: „deft‟ }; var opts = $.extend(opts, settings); };

$(“div”).wield({ skill_level: „weak‟ });

Page 15: Writing Jquery Plugins
Page 16: Writing Jquery Plugins

$.fn.amuse = function(settings) { /* ... */ this.each(function () { /* todo: impl something gut-wrenching here */ }); };

Page 17: Writing Jquery Plugins

$.fn.wield = function(settings) { /* ... */ return this; };

Page 18: Writing Jquery Plugins
Page 19: Writing Jquery Plugins

$.fn.wield.defaults = { weapon: „nunchuck‟, skill_level: „deft‟ };

$.fn.wield.level_up_skill = function () { /* ... */ };

Page 20: Writing Jquery Plugins
Page 21: Writing Jquery Plugins
Page 22: Writing Jquery Plugins

Power Plugin: http://www.flickr.com/photos/randomurl/438112948/ CC Attribution - Zevotron's photostream Extension Cord: http://www.flickr.com/photos/a_mason/7251818/ CC Attribution - Andrew Mason's photostream Generator: http://www.flickr.com/photos/kylemacdonald/60760497/ CC Attribution - kylemac's photostream Nuclear Powerplant: http://www.flickr.com/photos/senoranderson/259110332/ CC Attribution - PhotoDu.de's photostream Explosion: http://www.flickr.com/photos/ctbto/4926598654/ Public domain Lego Millenium Falcon: http://www.flickr.com/photos/andresrueda/3671175770/ CC Attribution - Andres Rueda's photostream Playmobile Suits: http://www.flickr.com/photos/tico24/93036054/ CC Attribution - Plinkk's photostream Star Wars Cookie: http://www.flickr.com/photos/betsyweber/4961703633/ CC Attribution - betsyweber's photostream Piggy Bank: http://www.flickr.com/photos/alancleaver/4279482716/ CC Attribution - alancleaver_2000's photostream Foreclosure: http://www.flickr.com/photos/respres/2539334956/ CC Attribution - respres' photostream One Finger: http://www.flickr.com/photos/sudhamshu/3202963823/ CC Attribution - Sudhamshu's photostream

Wall Street Bull: http://www.flickr.com/photos/thenails1/3407072012/ CC Attribution - thenails' photostream Batmobile: http://www.flickr.com/photos/ozzywu1974/921426847/ CC Attribution - JOE WU's photostream Rollercoaster Loop: http://www.flickr.com/photos/daveynin/4488753036/ CC Attribution - daveynin's photostream Chain: http://www.flickr.com/photos/sudhamshu/3240899911/ CC Attribution - Sudhamshu's photostream Street Fighter: http://www.flickr.com/photos/agius/3564611725/ CC Attribution - agius' photostream Rod Johnson Bobble: Photo by David Hale, used with permission Baseball: http://www.flickr.com/photos/emples/4567228276/ CC Attribution - emples' photostream Capitol: http://www.flickr.com/photos/cloudsoup/217776387/in/photostream/ CC Attribution - cloudsoup's photostream Village People: http://www.flickr.com/photos/dylwalters/1198643171/ CC Attribution - The Dilly Lama's photostream Rockycode background and logo: By Jake Trent Bebas Neue font: By Dharama Type - dharmatype.com – free for commercial, non-commercial use Anonymous Pro font: By Mark Simonson, SIL Open Font License, Version 1.1 – free when not sold as a font Thanks to my family for their support, Dan Harmer for 10 billable hours, coworkers for their good ideas

Page 23: Writing Jquery Plugins

rockycode.com/blog/tech/jquery/