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
390
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
330

Other Decks in Technology

See All in Technology
PHP開発者のためのSOLID原則再入門 #phpcon / PHP Conference Japan 2025
Avatar for shogogg shogogg
4
890
OpenHands🤲にContributeしてみた
Avatar for kotauchisunsun kotauchisunsun
1
470
Tech-Verse 2025 Global CTO Session
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
560
Witchcraft for Memory
Avatar for pocke pocke
1
480
あなたの声を届けよう！ 女性エンジニア登壇の意義とアウトプット実践ガイド #wttjp / Call for Your Voice
Avatar for kondoyuko kondoyuko
4
480
GeminiとNotebookLMによる金融実務の業務革新
Avatar for abenben abenben
0
240
TechLION vol.41～MySQLユーザ会のほうから来ました / techlion41_mysql
Avatar for sakaik sakaik
0
190
Amazon S3標準/ S3 Tables/S3 Express One Zoneを使ったログ分析
Avatar for ShigeruOda shigeruoda
4
560
Model Mondays S2E03: SLMs & Reasoning
Avatar for Nitya Narasimhan, PhD nitya
0
110
解析の定理証明実践＠Lean 4
Avatar for H Segawa dec9ue
0
180
急成長を支える基盤作り〜地道な改善からコツコツと〜 #cre_meetup
Avatar for すてにゃん stefafafan
0
130
mrubyと micro-ROSが繋ぐロボットの世界
Avatar for Katsuhiko Kageyama kishima
2
350

Featured

See All Featured
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
39
1.9k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
357
30k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
90
590k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
233
17k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
8
800
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
270
20k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
207
24k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
181
53k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
31
8.7k

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