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

Web Bites

Matthew Buchanan
November 13, 2008
Technology
2
120

Web Bites

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

Matthew Buchanan

November 13, 2008
Tweet

More Decks by Matthew Buchanan

See All by Matthew Buchanan
Better Letters
matthewbuchanan
2
130
Pragmatic Approaches to the Mobile Web
matthewbuchanan
0
99
Zero to Hero, a jQuery Primer
matthewbuchanan
8
390
Map Local and other works of Staggering Genius
matthewbuchanan
1
120
The State of Web Type
matthewbuchanan
5
290
Tumblr 20x20
matthewbuchanan
3
160
Web Typography
matthewbuchanan
5
330

Other Decks in Technology

See All in Technology
SREとしてスタッフエンジニアを目指す / SRE Kaigi 2025
tjun
15
6.5k
Agentic AI時代のプロダクトマネジメントことはじめ〜仮説検証編〜
masakazu178
3
400
Amazon Location Serviceを使ってラーメンマップを作る
ryder472
2
160
“自分”を大切に、フラットに。キャリアチェンジしてからの一年 三ヶ月で見えたもの。
maimyyym
0
300
バクラクの組織とアーキテクチャ（要約）2025/01版
shkomine
13
3k
[SRE kaigi 2025] ガバメントクラウドに向けた開発と変化するSRE組織のあり方 / Development for Government Cloud and the Evolving Role of SRE Teams
kazeburo
4
1.9k
2025/1/29 BigData-JAWS 勉強会 #28 (re:Invent 2024 re:Cap)/new-feature-preview-q-in-quicksight-scenarios-tried-and-tested
emiki
0
310
ObservabilityCON on the Road Tokyoの見どころ
hamadakoji
0
210
20250129 Findy_テスト高活用化
dshirae
0
230
パフォーマンスとコスト改善のために法人データ分析基盤をBigQueryに移行した話
seiya303
1
100
Redmineの意外と知らない便利機能 （Redmine 6.0対応版）
vividtone
0
190
CNAPPから考えるAWSガバナンスの実践と最適化
yuobayashi
5
680

Featured

See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Documentation Writing (for coders)
carmenintech
67
4.6k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
192
16k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
BBQ
matthewcrist
85
9.4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Navigating Team Friction
lara
183
15k
Adopting Sorbet at Scale
ufuk
74
9.2k
Bootstrapping a Software Product
garrettdimon
PRO
305
110k

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