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

JSを使わなくてもCSSでできるようになったこと

Avatar for Fuminori Mori Fuminori Mori
January 11, 2020
Technology
0
2k

 JSを使わなくてもCSSでできるようになったこと

鹿児島市のマークメイザンで2020年1月11日に開催された「ゆるやかな合同Web勉強会」でのLTのスライドです。

Avatar for Fuminori Mori

Fuminori Mori

January 11, 2020
Tweet

More Decks by Fuminori Mori

See All by Fuminori Mori
GRID RANGERS
Avatar for Fuminori Mori moonglows76
0
220
FLEXBOX-MEN: Apocalypse
Avatar for Fuminori Mori moonglows76
4
490

Other Decks in Technology

See All in Technology
Modern Linux
Avatar for oracle4engineer oracle4engineer
PRO
0
170
「何となくテストする」を卒業するためにプロダクトが動く仕組みを理解しよう
Avatar for kawabeaver kawabeaver
0
440
スマートファクトリーの第一歩 〜AWSマネージドサービスで 実現する予知保全と生成AI活用まで
Avatar for wanda ganota
2
330
測りにくい成果を測る — BtoB SaaSにおける効果検証への挑戦 / Shirokane Kougyou vol 20
Avatar for Sansan R&D sansan_randd
2
140
会社紹介資料 / Sansan Company Profile
Avatar for Sansan, Inc. sansan33
PRO
7
380k
まずはマネコンでちゃちゃっと作ってから、それをCDKにしてみよか。
Avatar for ヤマダ（北野） yamada_r
2
120
エンジニアが主導できる組織づくり ー 製品と事業を進化させる体制へのシフト
Avatar for Shin'ya Ueoka ueokande
1
120
LLM時代のパフォーマンスチューニング：MongoDB運用で試したコンテキスト活用の工夫
Avatar for ishikawa-pro ishikawa_pro
0
180
Django's GeneratedField by example - DjangoCon US 2025
Avatar for Paolo Melchiorre pauloxnet
0
160
Codeful Serverless / 一人運用でもやり抜く力
Avatar for kensh _kensh
7
460
20250910_障害注入から効率的復旧へ_カオスエンジニアリング_生成AIで考えるAWS障害対応.pdf
Avatar for sh_fk2 sh_fk2
3
280
データ分析エージェント Socrates の育て方
Avatar for na0 na0
8
3.2k

Featured

See All Featured
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
180
9.9k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
210k
Done Done
Avatar for chrislema chrislema
185
16k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
131
19k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
22k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
72
11k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7.1k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
29
2.9k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
15k
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
352
21k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
8
930
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
36
6.9k

Transcript

  1. JSΛ࢖Θͳͯ͘΋ CSSͰͰ͖ΔΑ͏ʹͳͬͨ͜ͱ 2020-01-11 @ ΏΔ΍͔ͳ߹ಉWebษڧձ ίʔσΟϯάσβΠϯɹ৿ ࢙ݑ h$PEJOH%FTJHO 

  2. ίʔσΟϯάσβΠϯ ৿ɹ࢙ݑ ίʔμʔ ॻ੶ஶऀ ߨࢣ Πϕϯτओ࠵ऀ h$PEJOH%FTJHO 

  3. CSSͰʮಈ͖ʯΛ ఏڙͰ͖ΔΑ͏ʹͳͬͨʂ h$PEJOH%FTJHO 

  4. ͜Ε·ͰJavaScriptͰ ࣮૷͖ͯͨ͜͠ͱɺ h$PEJOH%FTJHO 

  5. CSS͚ͩͰ Ͱ͖Δ͜ͱ͋ΔΑʔͬʂ h$PEJOH%FTJHO 

  6. ✋✋ ݟͯΈ͍ͨਓʔʔʔʂ h$PEJOH%FTJHO 

  7. ! ! ͋͟ʔʔʔͬ͢ʂ ! h$PEJOH%FTJHO 

  8. εϜʔζεΫϩʔϧʂʂ h$PEJOH%FTJHO 

  9. $0%&1&/ h$PEJOH%FTJHO 

  10. h$PEJOH%FTJHO 

  11. !!! ϝϦοτ ϓϩύςΟ1ͭͰ࣮૷! ʢscroll-behaviorʣ h$PEJOH%FTJHO 

  12. !!! σϝϦοτ ࡉ͔͍ௐ੔͸Ͱ͖ͳʔ͍ h$PEJOH%FTJHO 

  13. ✋✋ ΋ͬͱ ✋✋ ݟͯΈ͍ͨਓʔʔʔʂ h$PEJOH%FTJHO 

  14. ! ɹ ! ɹ ! ͋͟ʔʔʔͬ͢ʂ ! ɹ ! ɹ

    h$PEJOH%FTJHO 

  15. εΫϩʔϧ్த͔Β ্෦ʹݻఆʂʂʂ h$PEJOH%FTJHO 

  16. $0%&1&/ h$PEJOH%FTJHO 

  17. h$PEJOH%FTJHO 

  18. !!! ϝϦοτ ϓϩύςΟ2ͭͰ࣮૷! ʢposi'onͱtopʣ h$PEJOH%FTJHO 

  19. !!! σϝϦοτ ࡉ͔͍ௐ੔͸Ͱ͖ͳʔ͍ ʢຊ೔̎ճ໨ʣ h$PEJOH%FTJHO 

  20. ࡉ͔͍͜ͱݴΘͳ͍ͳΒ CSSͰ࣮૷΋͋Γ͔΋ʁ h$PEJOH%FTJHO 

  21. ·ͱΊ h$PEJOH%FTJHO 

  22. ʮεϜʔζεΫϩʔϧʯ͸ htmlཁૉʹ scroll-behavior: smooth; h$PEJOH%FTJHO 

  23. ʮεΫϩʔϧ్த͔Β্෦ʹݻఆʯ͸ ର৅ཁૉʹ posi%on: s%cky;ɹtop: 0; h$PEJOH%FTJHO 

  24. ؾʹͳͬͨΒ ࢖ͬͯΈΑʔʔʔʂ h$PEJOH%FTJHO 

  25. ຖ݄தԝӺۙ͘Ͱ ͯ͛ͯ͛ͳΏΔʔ͍ษڧձ ͯ͛Web΍ͬͯ·͢ʂ h$PEJOH%FTJHO 

  26. ʢ࠷ۙຖ݄Ͱ͸ͳ͘ͳͬͯ·͕͢… ʣ h$PEJOH%FTJHO 

  27. ৄ͘͠͸ʮͯ͛Webʯ FacebookϖʔδͰʂ IUUQTXXXGBDFCPPLDPNUFHFXFC h$PEJOH%FTJHO 

  28. ! ɹ ! ɹ ! ͋͟·ͨͬ͠ʂ ! ɹ ! ɹ

    h$PEJOH%FTJHO