CSSã§ãƒ©ãƒ³ãƒ€ãƒ ボタン - ksk1015ã®ãƒ–ãƒã‚°CSS Programing Advent Callendar 2012 ã®15日目ã§ã™ã€‚ 日をã¾ãŸã„ã§ã—ã¾ã„申ã—訳ãªã„ã§ã™ã€‚ カレンダーã«ã¯ä¹±æ•°ã¨æ›¸ãã¾ã—ãŸãŒã€ä¹±æ•°ã¯è¨€ã„éŽãŽã§ã™ã。CSSã ã‘ã§ã‚‚ランダムãªçµæžœã‚’è¿”ã™ãƒœã‚¿ãƒ³ã‚’作るã“ã¨ãŒã§ãã¾ã™ã€‚ ã“れを利用ã—ã¦CSSãŠã¿ãã˜ã‚’作りã¾ã—ãŸã€‚ http://jsdo.it/ksk1015/wTlL ãã—ã¦ä»¥ä¸‹ãŒè§£èª¬ç”¨ã®ã‚µãƒ³ãƒ—ルã§ã™ http://jsdo.it/ksk1015/joOY ã”覧ãã ã•ã„。 ランダムボタンã¨ã„ã†ã®ã¯é€æ˜Žã®labelã‚’animationã§å‹•ã‹ã—ã¦ä½•ã®ãƒ©ãƒ™ãƒ«ãŒã‚¯ãƒªãƒƒã‚¯ã•ã‚Œã‚‹ã‹ã‚ã‹ã‚‰ãªã„ã¨ã„ã†ä»•çµ„ã¿ã®ãƒœã‚¿ãƒ³ã§ã™ã€‚ ãƒã‚¤ãƒ³ãƒˆã¯ã€acitve時ã«animatio-play-state: pausedã«ã—ã¦ã€ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã‚’一時åœæ¢ã—ãˆã‚ã’ã‚‹ã“ã¨ã§ã™ã€‚ animationã¨ã‹ã§å‹•ã‹ã—ã¦ã‚‹è¦ç´ ã®ã‚¯ãƒªãƒƒã‚¯ã¯ã€mousedownã—ã¦
{{#tags}}- {{label}}
{{/tags}}