Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Web Bites
Search
Matthew Buchanan
November 13, 2008
Technology
2
130
Web Bites
Presented to the Auckland Web Meetup (20x20 format), November 2008.
Matthew Buchanan
November 13, 2008
Tweet
Share
More Decks by Matthew Buchanan
See All by Matthew Buchanan
Better Letters
matthewbuchanan
2
140
Pragmatic Approaches to the Mobile Web
matthewbuchanan
0
100
Zero to Hero, a jQuery Primer
matthewbuchanan
8
390
Map Local and other works of Staggering Genius
matthewbuchanan
1
130
The State of Web Type
matthewbuchanan
5
290
Tumblr 20x20
matthewbuchanan
3
170
Web Typography
matthewbuchanan
5
330
Other Decks in Technology
See All in Technology
対話型音声AIアプリケーションの信頼性向上の取り組み
ivry_presentationmaterials
3
1k
Microsoft Defender XDRで疲弊しないためのインシデント対応
sophiakunii
1
310
shake-upを科学する
rsakata
7
1k
「Chatwork」のEKS環境を支えるhelmfileを使用したマニフェスト管理術
hanayo04
1
400
Amazon SNSサブスクリプションの誤解除を防ぐ
y_sakata
3
190
データ戦略部門 紹介資料
sansan33
PRO
1
3.3k
衛星運用をソフトウェアエンジニアに依頼したときにできあがるもの
sankichi92
1
1k
How to Quickly Call American Airlines®️ U.S. Customer Care : Full Guide
flyaahelpguide
0
240
公開初日に Gemini CLI を試した話や FFmpeg と組み合わせてみた話など / Gemini CLI 初学者勉強会(#AI道場)
you
PRO
0
1.3k
AWS CDK 入門ガイド これだけは知っておきたいヒント集
anank
5
750
全部AI、全員Cursor、ドキュメント駆動開発 〜DevinやGeminiも添えて〜
rinchsan
10
5.1k
IPA&AWSダブル全冠が明かす、人生を変えた勉強法のすべて
iwamot
PRO
2
230
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
695
190k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
What's in a price? How to price your products and services
michaelherold
246
12k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Scaling GitHub
holman
460
140k
How STYLIGHT went responsive
nonsquared
100
5.6k
Six Lessons from altMBA
skipperchong
28
3.9k
Code Review Best Practice
trishagee
69
19k
Site-Speed That Sticks
csswizardry
10
700
Docker and Python
trallard
45
3.5k
BBQ
matthewcrist
89
9.7k
Transcript
Matthew Buchanan Transmit + Docksend www.panic.com/transmit/
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan Transmit + Docksend
Matthew Buchanan jQuery www.jquery.com
jQuery JavaScript library by John Resig et al • Interoperable
• Compact filesize • Concise notation • Uses CSS selectors • Extensible • Popular Matthew Buchanan jQuery
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
jQuery function jQuery("#wrap p") jQuery("p") jQuery("p:last") Shorthand $("#wrap p") Matthew
Buchanan jQuery
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
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
Page load $(document).ready(function() { … }); Or, for the really
concise: $(function() { … }); Matthew Buchanan jQuery
Chaining $("a").addClass("hidden").hide().html("Gone.") Ajax $("#intro").load("path/to/file.html") Matthew Buchanan jQuery
Example by Karl Swedberg $(function() { var txt = "";
$("h2 a").each(function() { txt = $(this).text() .replace(/ (\w+)$/," $1"); $(this).html(txt); }); }); Matthew Buchanan jQuery
Example $(function() { $("#nav a.search").click(function() { $("#searchbar").slideToggle("fast"); }); }); Matthew
Buchanan jQuery
Matthew Buchanan Typophile Forums www.typophile.com/forum/
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
Matthew Buchanan Fin matthewbuchanan.name