Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Web Bites

Avatar for Matthew Buchanan Matthew Buchanan
November 13, 2008
Technology
2
130

Web Bites

Presented to the Auckland Web Meetup (20x20 format), November 2008.

Avatar for Matthew Buchanan

Matthew Buchanan

November 13, 2008
Tweet

More Decks by Matthew Buchanan

See All by Matthew Buchanan
Better Letters
Avatar for Matthew Buchanan matthewbuchanan
2
140
Pragmatic Approaches to the Mobile Web
Avatar for Matthew Buchanan matthewbuchanan
0
100
Zero to Hero, a jQuery Primer
Avatar for Matthew Buchanan matthewbuchanan
8
400
Map Local and other works of Staggering Genius
Avatar for Matthew Buchanan matthewbuchanan
1
130
The State of Web Type
Avatar for Matthew Buchanan matthewbuchanan
5
290
Tumblr 20x20
Avatar for Matthew Buchanan matthewbuchanan
3
170
Web Typography
Avatar for Matthew Buchanan matthewbuchanan
5
340

Other Decks in Technology

See All in Technology
[Journal club] Thinking in Space: How Multimodal Large Language Models See, Remember, and Recall Spaces
Avatar for Semantic Machine Intelligence Lab., Keio Univ. keio_smilab
PRO
0
110
20251029_Cursor Meetup Tokyo ＃02_MK_「あなたのAI、私のシェル」 - プロンプトインジェクションによるエージェントのハイジャック
Avatar for Masayuki Kawakita mk0721
PRO
6
2.4k
AWS re:Invent 2025事前勉強会資料 / AWS re:Invent 2025 pre study meetup
Avatar for Masanori Yamaguchi kinunori
0
1.1k
AIで急増した生産「量」の荒波をCodeRabbitで乗りこなそう
Avatar for Atsushi Nakatsugawa moongift
PRO
0
470
設計に疎いエンジニアでも始めやすいアーキテクチャドキュメント
Avatar for Tomonori Hayashi / ぴーはや phaya72
27
18k
窓口業務を生成AIにおまかせ！Bedrock Agent Coreで実現する自治体AIエージェント！
Avatar for Ray Oshikawa rayofhopejp
0
160
30分でわかる！！ 『OCI で学ぶクラウドネイティブ 実践 X 理論ガイド』
Avatar for oracle4engineer oracle4engineer
PRO
1
110
CLIPでマルチモーダル画像検索 →とても良い
Avatar for Motoi Washida wm3
2
800
AI時代の発信活動 ～技術者として認知してもらうための発信法～ / 20251028 Masaki Okuda
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
140
ゼロコード計装導入後のカスタム計装でさらに可観測性を高めよう
Avatar for SansanTech sansantech
PRO
1
710
[re:Inent2025事前勉強会(有志で開催)] re:Inventで見つけた人生をちょっと変えるコツ
Avatar for sh_fk2 sh_fk2
1
1.3k
Spec Driven Development入門/spec_driven_development_for_learners
Avatar for Ryo Tomidokoro hanhan1978
1
640

Featured

See All Featured
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.3k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
272
21k
Docker and Python
Avatar for Tania Allard trallard
46
3.6k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.6k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.1k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3k
A better future with KSS
Avatar for Kyle Neath kneath
239
18k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k

Transcript

  1. Matthew Buchanan Transmit + Docksend www.panic.com/transmit/

  2. Matthew Buchanan Transmit + Docksend

  3. Matthew Buchanan Transmit + Docksend

  4. Matthew Buchanan Transmit + Docksend

  5. Matthew Buchanan Transmit + Docksend

  6. Matthew Buchanan Transmit + Docksend

  7. Matthew Buchanan Transmit + Docksend

  8. Matthew Buchanan Transmit + Docksend

  9. Matthew Buchanan Transmit + Docksend

  10. Matthew Buchanan Transmit + Docksend

  11. Matthew Buchanan Transmit + Docksend

  12. Matthew Buchanan Transmit + Docksend

  13. Matthew Buchanan jQuery www.jquery.com

  14. jQuery JavaScript library by John Resig et al • Interoperable

    • Compact filesize • Concise notation • Uses CSS selectors • Extensible • Popular Matthew Buchanan jQuery

  15. Hosted by Google <head> … <script type="text/javascript" src="http://ajax.googleapis.com/ajax/ libs/jquery/1.2.6/jquery.min.js"></script> …

    </head> Matthew Buchanan jQuery

  16. jQuery function jQuery("#wrap p") jQuery("p") jQuery("p:last") Shorthand $("#wrap p") Matthew

    Buchanan jQuery

  17. Collections $("#wrap p") returns a collection of every <p> inside

    element #wrap Methods $("#wrap p").addClass("intro") $("#wrap div").each(function(div) { … }) Matthew Buchanan jQuery

  18. Event Handlers $("a").click(function(ev) { $(this).css({ font-size: 200% }); ev.preventDefault(); });

    Causes every anchor to double in size when clicked Matthew Buchanan jQuery

  19. Page load $(document).ready(function() { … }); Or, for the really

    concise: $(function() { … }); Matthew Buchanan jQuery

  20. Chaining $("a").addClass("hidden").hide().html("Gone.") Ajax $("#intro").load("path/to/file.html") Matthew Buchanan jQuery

  21. Example by Karl Swedberg $(function() { var txt = "";

    $("h2 a").each(function() { txt = $(this).text() .replace(/ (\w+)$/,"&nbsp;$1"); $(this).html(txt); }); }); Matthew Buchanan jQuery

  22. Example $(function() { $("#nav a.search").click(function() { $("#searchbar").slideToggle("fast"); }); }); Matthew

    Buchanan jQuery

  23. Matthew Buchanan Typophile Forums www.typophile.com/forum/

  24. Matthew Buchanan Typophile Forums “Logo is custom, but GOOD uses

    Vista Sans and Trade Gothic No. 20 Condensed Bold [in]each issue.” —Stephen Coles “The logo was hand-drawn by Arnaud Mercier. … We use Vista, Benton, Trade Gothic Bold Condensed, Sabon, and Doric Bold … for bold ledes.” —Scott Stowell

  25. Matthew Buchanan Fin matthewbuchanan.name