今一番気ã«ãªã‚‹CSSã®ç¾Žã—ã„エフェクトï¼ã‚¤ãƒ³ã‚¯ã‚’æ°´é¢ã«è½ã¨ã—ãŸã‚ˆã†ã«æ³¢ç´‹ãŒåºƒãŒã‚Šæ¶ˆãˆã¦ã„ã -Ripple Click EffectGoogleãŒå…ˆæ—¥ç™ºè¡¨ã—ãŸæ–°ã—ã„UX「Material Designã€ã®ä¸ã§ç‰¹ã«æ³¨ç›®ã•ã‚Œã¦ã„ã‚‹ã®ãŒã€ã‚¿ãƒƒãƒ—やクリックをã™ã‚‹ã¨ã‚¤ãƒ³ã‚¯ã‚’è½ã¨ã—ãŸã‚ˆã†ã«æ³¢ç´‹ãŒåºƒãŒã‚‹ã‚¨ãƒ•ã‚§ã‚¯ãƒˆã€‚ ã“れを実装ã™ã‚‹ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯ã‚’紹介ã—ã¾ã™ã€‚ Material Designã«ã¤ã„ã¦ã¯ã€å‰ã®è¨˜äº‹ï¼ˆã€Œæ³¢ç´‹ã€ã®ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã‚’実装ã™ã‚‹ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯ï¼‰ã§å‹•ç”»ã‚’紹介ã—ã¦ã„ã¾ã™ã€‚ ã“ã®æ³¢ç´‹ã®ã‚¨ãƒ•ã‚§ã‚¯ãƒˆã¯ã‚ã¡ã“ã¡ã®ã‚³ãƒŸãƒ¥ãƒ‹ãƒ†ã‚£ã§ç››ã‚“ã§ã€ãã®ä¸ã§ã‚‚ã“ã“ã§ç´¹ä»‹ã™ã‚‹ã‚¨ãƒ•ã‚§ã‚¯ãƒˆã¯ã‹ãªã‚Šç¾Žã—ã仕上ãŒã£ã¦ã„ã¾ã™ã€‚ デモã§ã¯ãƒªã‚¹ãƒˆã§é…ç½®ã—ãŸãƒŠãƒ“ゲーションã®å„アイテムをクリックã™ã‚‹ã¨ã€ãã®ã‚¯ãƒªãƒƒã‚¯ã—ãŸåœ°ç‚¹ã‚’ä¸å¿ƒã«æ³¢ç´‹ãŒåºƒãŒã‚Šã€ãƒ•ã‚§ãƒ¼ãƒ‰ã§æ¶ˆãˆã¦ã„ãã¾ã™ã€‚ ※上記ã¯ã‚¨ãƒ•ã‚§ã‚¯ãƒˆãŒåˆ†ã‹ã‚Šã‚„ã™ã„よã†ã€å„アイテムã®é«˜ã•ã‚’広ã’ã¦ã„ã¾ã™ã€‚ 実際ã®å‹•ä½œã¯ã€ä¸‹è¨˜ãƒšãƒ¼ã‚¸ã§ãŠæ¥½ã—ã¿ãã ã•ã„。 Ripple Click Effect from Google Material De
{{#tags}}- {{label}}
{{/tags}}