react-useを使ã£ã¦ã‚«ãƒ«ãƒ¼ã‚»ãƒ«ã‚’作ã£ã¦ã¿ãŸã¯ã˜ã‚ã« ã“ã‚“ã«ã¡ã¯ï¼ スペースマーケットã§ãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã‚’ã—ã¦ã„ã‚‹k___0122ã§ã™ã€‚ 今回ã¯react-useã®useIntersectionを使ã£ã¦ä»¥ä¸‹ã®ã‚ˆã†ãªã‚«ãƒ«ãƒ¼ã‚»ãƒ«ã‚’作ã£ãŸã®ã§ç´¹ä»‹ã—ãŸã„ãªã¨æ€ã„ã¾ã™ï¼ デモアプリ https://carousel-practice.vercel.app/ 完æˆå½¢ã®ã‚³ãƒ¼ãƒ‰ https://github.com/kazuki0122/carousel_practice 今回作るカルーセルã¯ä»¥ä¸‹ã®ä»•æ§˜ã§å®Ÿè£…ã—ã¾ã™ã€‚ スクãƒãƒ¼ãƒ«ãŒã§ãã‚‹ã“㨠インジケーターãŒç¾åœ¨è¡¨ç¤ºã•ã‚Œã¦ã‚‹ç”»åƒã«åˆã‚ã›ã¦æ´»æ€§åŒ–ã™ã‚‹ã“㨠矢å°ã‚’クリックã—ãŸã‚‰ç”»åƒãŒåˆ‡ã‚Šæ›¿ã‚ã‚‹ã“㨠実装ã—ã¦ã¿ã‚‹ スクãƒãƒ¼ãƒ«ãŒã§ãã‚‹ã“ã¨ã¯ä»¥ä¸‹ã®CSSã®ã¿ã§ã§ãã¾ã™ã€‚ overflow-x: scrollã§ã¯ã¿å‡ºã—ãŸè¦ç´ をスクãƒãƒ¼ãƒ«ã§ãるよã†ã«ã—ã¾ã™ã€‚ ã¾ãŸscroll-snap-type: x m
{{#tags}}- {{label}}
{{/tags}}