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
120
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
130
Pragmatic Approaches to the Mobile Web
matthewbuchanan
0
95
Zero to Hero, a jQuery Primer
matthewbuchanan
8
380
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
Oracle Autonomous Database:サービス概要のご紹介
oracle4engineer
PRO
1
7.1k
OCI で始める!! Red Hat OpenShift / Get Started OpenShift on OCI
oracle4engineer
PRO
1
190
JEP 480: Structured Concurrency
aya_ebata
0
130
開発者の定量・定性データを組み合わせて開発者体験を把握するための取り組み
ham0215
1
140
PDF Viewer作成の今までとこれから
hunachi
0
480
JTCや セキュリティチェックリストが夢の跡
nikinusu
1
710
内製化を目指す事業会社が、システム開発会社と共に進める「開発生産性改善」の取り組み事例 #devsumi
yuwji
1
110
言葉は感情の近似値である。その感情と言葉の誤差を最小化しよう ~コミュニケーションにおけるアナログ/デジタル変換の課題に立ち向かう~
nktamago
0
230
サーバー管理しないサーバーサービスManaged DevOps Pool
kkamegawa
0
130
Functional TypeScript
naoya
11
4.8k
とあるOSSを継続可能にするための取り組みについて / OSS Refactoring Process
bun913
1
210
Road to Single Activity
yurihondo
2
240
Featured
See All Featured
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
248
20k
Designing with Data
zakiwarfel
98
5k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
109
6.9k
YesSQL, Process and Tooling at Scale
rocio
167
14k
KATA
mclloyd
27
13k
Agile that works and the tools we love
rasmusluckow
327
20k
A Philosophy of Restraint
colly
202
16k
Optimising Largest Contentful Paint
csswizardry
31
2.8k
Music & Morning Musume
bryan
46
6k
The Mythical Team-Month
searls
218
43k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
354
29k
The World Runs on Bad Software
bkeepers
PRO
64
11k
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