<form>があればゴルフもできる / If a <form> is there, you can play golf.

https://tangolf.hatelabo.jp/

Transcript

1. GPSN
   ͕͋Ε͹
   ΰϧϑ
   ΋Ͱ͖Δ
   🏆
   

   View Slide

2. View Slide

3. View Slide

4. ୯ޠΛϕΫτϧԽ͠
   ʮҙຯΛ଍͠Ҿ͖ʯͯ͠༡Ϳ
   ΰϧϑήʔϜ
   

   View Slide

5. ͸͡·Γ
   

   View Slide

6. View Slide

7. ΰϧϑͱԕ͗͢Δʜ
   

   View Slide

8. ΰϧϑͯ͠Δײ
   

   View Slide

9. ͯ͠Δײ
   🎮
   

   View Slide

10. ը໘্ͷԿ͔Λૢ࡞Ͱ͖Δɻ
    ͨͩͦΕ͚ͩͰɺ
    ຊ౰͸ॏͨ͞΋Կ΋ͳ͍ͱ͜Ζʹ
    ੜཧײ֮Λ࡞Δɻ
    ʰࡩҪ੓തͷήʔϜʹ͍ͭͯࢥ͏͜ͱʱΑΓ
    

    View Slide

11. ͯ͠Δײ
    ߦҝͱ஌֮Λ૊Έ߹ΘͤΔ͜ͱ
    Ͱٖࣅతͳ਎ମײ͕֮ಘΒΕΔ
    🤜
    💥
    

    View Slide

12. ಧ͘
    ⛳
    ඈͿ
    ଧͭ
    🏌
    

    View Slide

13. ಧ͘
    ඈͿ
    ଧͭ
    ݁Ռ͕දࣔ
    ૹ৴த
    ೖྗͯ͠ૹ৴
    

    View Slide

14. ଧͬͨײ
    🏌
    

    View Slide

15. ϘʔϧΛଧͭ
    🏌
    

    View Slide

16. ඈͿ
    ଧͭ
    ϘʔϧΛଧͭ ʴ
    ʔ
    

    View Slide

17. ൃࣹͨ͠Α͏ʹݟ͑Δ
    

    View Slide

18. ஄͘
    ଧͭ
    ʴ
    ʔ
    ඈͿ
    💥
    ϘʔϧΛଧͭ
    

    View Slide

19. JOQVUͰεΠϯά͢Δ
    @keyframes swing {
    
    
    0% {
    
    
    transform: rotateX(0deg);
    
    
    }
    
    
    80% {
    
    
    transform: rotateX(390deg);
    
    
    }
    
    
    100% {
    
    
    transform: rotateX(360deg);
    
    
    }
    
    
    }
    

    View Slide

20. γϣοτͷ൓ಈ
    EFH
    EFH
    EFHΑΓ
    ༨෼ʹճసͤͯ͞
    ໭͍ͯ͠Δ
    💥
    

    View Slide

21. ଧͬͨײ
    φΠεγϣοτ
    

    View Slide

22. ඈΜͩײ
    

    View Slide

23. Ϙʔϧ͕ඈͿ
    🏌 ⛳
    

    View Slide

24. Ϙʔϧ͕ඈͿ
    🏌 ⛳
    ඈڑ཭
    ߴ౓
    

    View Slide

25. @keyframes shot {
    
    
    0% {
    
    
    transform: scale(180%) translateY(0);
    
    
    }
    
    
    100% {
    
    
    transform: scale(0) translateY(-4000%);
    
    
    }
    
    
    }
    ೋ࣍ݩۭؒʹϘʔϧΛඈ͹͢
    

    View Slide

26. USBOTMBUF:
    
    USBOTMBUF:
    
    :࣠Ҡಈʹඈڑ཭
    

    View Slide

27. TDBMF
    TDBMF
    
    มഒʹٖࣅతͳߴ౓
    

    View Slide

28. TUBSU FOE
    BOJNBUJPOEVSBUJPO
    :࣠Ҡಈʷมഒ
    

    View Slide

29. ඈΜͩײ
    φΠεγϣοτ
    

    View Slide

30. ಧ͍ͨײ
    ⛳
    

    View Slide

31. Ϙʔϧ͕ಧ͘
    ⛳
    

    View Slide

32. ج఺ͱ໨ඪͷؒʹ͋Δڑ཭
    Λೝࣝ͢Δ͜ͱͰʮಧ͘ʯײ֮ΛಘΔ
    🏌 ⛳
    Ϙʔϧ͕ಧ͘
    ໨ඪ
    

    View Slide

33. ࢹઢ͕޲͔͍΍͍͢ը໘தԝʹ
    γϯϘϧͱͯ͠ͷ໨ඪΛઃஔ
    ໨ඪΛࣔ͢
    

    View Slide

34. ڑ཭Λࢹ֮Խ͢Δ
    ໨ඪ·Ͱͷڑ཭Λ
    ૬ରతʹදࣔ͢Δ͜ͱͰ
    ڑ཭ײΛ͔ͭΊΔΑ͏ʹ͢Δ
    

    View Slide

35. ໨ඪ͕ઃఆ͞ΕΔ
    ͜Ε͘Β͍
    ཭Ε͍ͯΔ
    ͜͜ʹ
    ϘʔϧΛಧ͚Δ
    

    View Slide

36. ෩ʹ͸ͨΊ͘ϐϯϑϥοά
    @keyframes flag {
    
    
    0% {
    
    
    transform: scaleX(100%) skewY(0deg);
    
    
    }
    
    
    20% {
    
    
    transform: scaleX(100%) skewY(-2deg);
    
    
    }
    
    
    80% {
    
    
    transform: scaleX(96%) skewY(2deg);
    
    
    }
    
    
    100% {
    
    
    transform: scaleX(100%) skewY(0deg);
    
    
    }
    
    
    }
    

    View Slide

37. ಈ͖ͷج఺ʹϙʔϧଆ
    

    View Slide

38. USBOTGPSNPSJHJO
    DFOUFSMFGU
    ಈ͖ͷج఺ʹϙʔϧଆ
    

    View Slide

39. :࣠܏ࣼʹ্Լͷಈ͖
    USBOTGPSNPSJHJO
    DFOUFSMFGU
    TLFX: EFH
    
    TLFX: EFH
    
    

    View Slide

40. USBOTGPSNPSJHJO
    DFOUFSMFGU
    TLFX: EFH
    
    TLFX: EFH
    
    :࣠܏ࣼʹ্Լͷಈ͖
    

    View Slide

41. USBOTGPSNPSJHJO
    DFOUFSMFGU
    TLFX: EFH
    
    TLFX: EFH
    
    :࣠܏ࣼʹ্Լͷಈ͖
    

    View Slide

42. USBOTGPSNPSJHJO
    DFOUFSMFGU
    TDBMF
    
    9࣠৳ॖʹલޙͷಈ͖
    

    View Slide

43. USBOTGPSNPSJHJO
    DFOUFSMFGU
    TDBMF
    
    9࣠৳ॖʹલޙͷಈ͖
    

    View Slide

44. USBOTGPSNPSJHJO
    DFOUFSMFGU
    TDBMF
    
    TDBMF
    
    9࣠৳ॖʹલޙͷಈ͖
    

    View Slide

45. ΧοϓΠϯ͢ΔϘʔϧ
    @keyframes cupIn {
    
    
    0% {
    
    
    transform: translateY(0);
    
    
    }
    
    
    20% {
    
    
    transform: translateY(-2px);
    
    
    }
    
    
    50% {
    
    
    opacity: 1;
    
    
    transform: translateY(0px) scale(100%);
    
    
    }
    
    
    100% {
    
    
    opacity: 0;
    
    
    transform: translateY(0px) scale(0);
    
    
    }
    
    
    }
    

    View Slide

46. TDBMF
    TDBMF
    
    มഒʹϘʔϧͷམԼ
    

    View Slide

47. ٵ͍ࠐ·ΕͨΑ͏ʹݟ͑Δ
    

    View Slide

48. ΧοϓΠϯͷϘʔϧͷಈ͖
    Χοϓͷ஍఺ͰਅԼʹམԼ͍ͯ͠Δ
    

    View Slide

49. ΧοϓΠϯͷϘʔϧͷಈ͖
    ௚ਐ͖ͯͨ͠Ϙʔϧʹ͸׳ੑ͕ಇ͘
    

    View Slide

50. TDBMF
    TDBMF
    
    USBOTMBUF:
    
    มഒʹϘʔϧͷམԼ
    USBOTMBUF:
    
    ׳ੑΛߟྀ͠
    ΍΍௨Γա͔͗ͯΒམԼͤ͞Δ
    

    View Slide

51. ಧ͍ͨײ
    φΠεγϣοτ
    

    View Slide

52. ΰϧϑײ
    🏌🏌🏌
    

    View Slide

53. ಧ͘
    ⛳
    ඈͿ
    ଧͭ
    🏌
    

    View Slide

54. ಧ͘
    ⛳
    ඈͿ
    ଧͭ
    🏌
    ଧͬͨײ0,
    

    View Slide

55. ಧ͘
    ⛳
    ඈͿ
    ଧͭ
    🏌
    ଧͬͨײ0,
    ඈΜͩײ0,
    

    View Slide

56. ಧ͘
    ⛳
    ඈͿ
    ଧͭ
    🏌
    ଧͬͨײ0,
    ඈΜͩײ0,
    ಧ͍ͨײ0,
    

    View Slide

57. ΰϧϑײ
    φΠεγϣοτ
    

    View Slide

58. ·ͱΊ
    

    View Slide

59. ਎ମײ֮Λઃܭ͢Ε͹
    GPSN͸ΰϧϑʹͳΔ
    

    View Slide

60. IUUQTUBOHPMGIBUFMBCPKQ
    ͥͻ༡ΜͰͶ
    

    View Slide

61. ׬
    

    View Slide