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
150
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
300
Tumblr 20x20
Avatar for Matthew Buchanan matthewbuchanan
3
180
Web Typography
Avatar for Matthew Buchanan matthewbuchanan
5
340

Other Decks in Technology

See All in Technology
Digitization部 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
1
6.8k
セキュリティについて学ぶ会 / 2026 01 25 Takamatsu WordPress Meetup
Avatar for Rocket Martue rocketmartue
1
300
30万人の同時アクセスに耐えたい！新サービスの盤石なリリースを支える負荷試験 / SRE Kaigi 2026
Avatar for GENDA genda
4
1.2k
What happened to RubyGems and what can we learn?
Avatar for Mike McQuaid mikemcquaid
0
280
変化するコーディングエージェントとの現実的な付き合い方 〜Cursor安定択説と、ツールに依存しない「資産」〜
Avatar for empitsu empitsu
4
1.4k
AWS Network Firewall Proxyを触ってみた
Avatar for nagisa_53 nagisa53
1
210
日本の85%が使う公共SaaSは、どう育ったのか
Avatar for たけだ taketakekaho
1
150
All About Sansan – for New Global Engineers
Avatar for Sansan, Inc. sansan33
PRO
1
1.3k
Azure Durable Functions で作った NL2SQL Agent の精度向上に取り組んだ話/jat08
Avatar for TonyTonyKun thara0402
0
170
名刺メーカーDevグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
1k
生成AIを活用した音声文字起こしシステムの2つの構築パターンについて
Avatar for Kazuki Miura miu_crescent
PRO
2
180
データの整合性を保ちたいだけなんだ
Avatar for ShoheiMitani shoheimitani
8
3.1k

Featured

See All Featured
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
Avatar for UX Y'all uxyall
0
330
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
700
Exploring the relationship between traditional SERPs and Gen AI search
Avatar for Ray Grieselhuber raygrieselhuber
PRO
2
3.6k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8k
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
Neural Spatial Audio Processing for Sound Field Analysis and Control
Avatar for NII S. Koyama's Lab skoyamalab
0
160
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
110
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.6k
Leo the Paperboy
Avatar for Maya Tellez mayatellez
4
1.4k
Evolving SEO for Evolving Search Engines
Avatar for Ryan Jones ryanjones
0
120
The Limits of Empathy - UXLibs8
Avatar for Cassini Nazir cassininazir
1
210

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