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

Making Magic with HTML5, CSS3, and jQuery

Avatar for Natalie MacLees Natalie MacLees
February 11, 2014
Technology
1
300

Making Magic with HTML5, CSS3, and jQuery

Presented at the HTML5/jQuery LA joint meetup

Avatar for Natalie MacLees

Natalie MacLees

February 11, 2014
Tweet

More Decks by Natalie MacLees

See All by Natalie MacLees
Creating content for everyone
Avatar for Natalie MacLees nataliemac
0
47
Making your website work for everyone: accessibility testing
Avatar for Natalie MacLees nataliemac
1
60
The Tangled Web We're Weaving: The Future of WordPress Accessibility
Avatar for Natalie MacLees nataliemac
0
58
Making the world a better place through web design
Avatar for Natalie MacLees nataliemac
0
160
One Percent Better: How little changes add up
Avatar for Natalie MacLees nataliemac
1
130
One percent better
Avatar for Natalie MacLees nataliemac
2
72
How to make time for a side hustle
Avatar for Natalie MacLees nataliemac
0
3.9k
Before You React
Avatar for Natalie MacLees nataliemac
2
440
Bulletproof JavaScript for plugins and themes
Avatar for Natalie MacLees nataliemac
2
290

Other Decks in Technology

See All in Technology
隙間ツール開発のすすめ / PHP Conference Fukuoka 2025
Avatar for meihei meihei3
0
420
CloudFormationコンソールから、 実際に作られたリソースを辿れるようになろう！
Avatar for amixedcolor amixedcolor
1
180
仕様は“書く”より“語る” - 分断を超えたチーム開発の実践 / 20251115 Naoki Takahashi
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
580
ある編集者のこれまでとこれから —— 開発者コミュニティと歩んだ四半世紀
Avatar for 稲尾尚徳 inao
4
2.3k
Flutterコントリビューションのススメ
Avatar for Koji Wakamiya d_r_1009
1
370
QAセントラル組織が運営する自動テストプラットフォームの課題と現状
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
390
Lazy Constant - finalフィールドの遅延初期化
Avatar for Yuichi.Sakuraba skrb
0
180
内部品質・フロー効率・コミュニケーションコストを悪化させ現場を苦しめかねない16の組織設計アンチパターン［超簡易版］ / 16 Organization Design Anti-Patterns for Software Development
Avatar for mtx2s mtx2s
2
210
明日から真似してOk！NOT A HOTELで実践している入社手続きの自動化
Avatar for kajinari nkajihara
1
390
us-east-1 の障害が 起きると なぜ ソワソワするのか
Avatar for Kazuki Miura miu_crescent
PRO
2
850
バクラクの AI-BPO を支える AI エージェント 〜とそれを支える Bet AI Guild〜
Avatar for Tomoaki tomoaki25
2
730
[mercari GEARS 2025] Building Foundation for Mercari’s Global Expansion
Avatar for mercari mercari
PRO
1
110

Featured

See All Featured
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.2k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.5k
It's Worth the Effort
Avatar for 3n 3n
187
28k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
73
4.9k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
140
34k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
5
740
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
3.2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
31
2.9k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
186
22k

Transcript

  1. making magic with html5, css3,and jquery by natalie maclees! @nataliemac

  2. html5 • new attributes! • new elements! • new capabilities

  3. css3 • new selectors! • new properties! • new capabilities

  4. jquery • powerful library! • two branches! • common tasks!

    • handy utilities

  5. bokeh effect

  6. clipped gallery

  7. css clip rect(top right bottom left)

  8. clipped gallery demo

  9. animated tabs

  10. filterable gallery

  11. jQuery for Designers by me :-)

  12. thank you! @nataliemac | nataliemac.com

  13. questions?