押ã—ã‚„ã™ã„カスタムデザインã®check/radioボックスを実ç¾ã§ãる「jquery-asCheckã€:phpspot開発日誌
amazingSurge/jquery-asCheck GitHub 押ã—ã‚„ã™ã„カスタムデザインã®check/radioボックスを実ç¾ã§ãる「jquery-asCheckã€ã€‚ 次ã®ã‚ˆã†ãªã‚«ã‚¹ã‚¿ãƒ デザインã§å¤§ãã‚ã®check/radioボックスãŒç°¡å˜ã«å®Ÿç¾ã§ãã¾ã™ã€‚ 関連エントリ ãƒã‚§ãƒƒã‚¯ã™ã‚‹ã¨ã„ã„æ„Ÿã˜ã«ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã™ã‚‹check,radioãŒä½œã‚Œã‚‹jQueryプラグイン「checkBoã€
[CSS]フォームã«ã¡ã‚‡ã£ã¨ã ã‘ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã‚’åŠ ãˆã¦æ¥½ã—ãã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆ -Animated Toggles
フォームã®ãƒã‚§ãƒƒã‚¯ãƒœãƒƒã‚¯ã‚¹ã¨ãƒ©ã‚¸ã‚ªãƒœã‚¿ãƒ³ã«ä½™åˆ†ã¯ã‚¿ã‚°ã¯ä½¿ç”¨ã›ãšã«ã€ã¡ã‚‡ã£ã¨ã ã‘ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã‚’åŠ ãˆã¦æ¥½ã—ãã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆã‚’紹介ã—ã¾ã™ã€‚ Animated Toggles HTML ãƒã‚§ãƒƒã‚¯ãƒœãƒƒã‚¯ã‚¹ã‚‚ラジオボタンも通常通りã«ãƒžãƒ¼ã‚¯ã‚¢ãƒƒãƒ—ã—ã¾ã™ã€‚ 余分ãªã‚¿ã‚°ã¯ç‰¹ã«ã‚ã‚Šã¾ã›ã‚“。 <form> <h1>Animated Toggles!</h1> <div class="controls"> <input id='check-1' type="checkbox" name='check-1' checked='checked' /> <label for="check-1">Apples</label> <input id='check-2' type="checkbox" name='check-1' /> <label for="check-2">Oranges</label> </div
ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³åˆ¶ä½œå‘ã‘】checkboxã‚’CSSã®ã¿ã§ã‚«ã‚¹ã‚¿ãƒžã‚¤ã‚º | ãƒã‚·ãƒ£ãƒã‚°ã€‚
ã“ã‚“ã«ã¡ã¯ã€ishida ã§ã™ã€‚ 先週金曜日ã€æ¨ªæµœã‚¹ã‚¿ã‚¸ã‚¢ãƒ ã§ãƒŽãƒ¼ãƒ’ットノーランをã“ã®ç›®ã§è¦‹ã¾ã—ãŸã€‚ ã‚„ã£ã±ã‚Šé‡Žçƒã¯ã‚¹ã‚¿ã‚¸ã‚¢ãƒ 観戦ãŒã„ã„ã§ã™ãªã€‚ ã•ã¦ã•ã¦ã€ä»¥å‰ã“ã¡ã‚‰ã®ãƒ–ãƒã‚°ã§ ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³åˆ¶ä½œå‘ã‘】radioボタンをCSSã®ã¿ã§ã‚«ã‚¹ã‚¿ãƒžã‚¤ã‚º ã¨ã„ã†è¨˜äº‹ã‚’書ãã¾ã—ãŸãŒã€ä»Šå›žã¯ã“ã¡ã‚‰ã®ç¶šç·¨ã§checkboxカスタマイズをã”紹介ã—ã¾ã™ã€‚ ソースコード コードã¯ã“ã¡ã‚‰ã§ã™ã€‚ ã‚ã£ã€ãれ㨠ãƒã‚·ãƒ£ãƒã‚°ã€‚㧠js.do.it アカウントを作æˆã—ã¾ã—ãŸã®ã§ã€ よã‚ã—ã‘ã‚Œã°ãƒ•ã‚©ãƒãƒ¼ã—ã¦ã„ãŸã ã‚‹ã¨å¹¸ã„ã§ã™ã€‚ ãƒã‚¤ãƒ³ãƒˆ checkbox本体をã€appearanceプãƒãƒ‘ティをbuttonã«ã—ã¦ã„ã¾ã™ã€‚ checkboxãŒãƒã‚§ãƒƒã‚¯ã•ã‚ŒãŸå ´åˆã«ã€:checked疑似クラスをã¤ã‹ã„ã¾ã™ã€‚ :checked疑似クラス ＋ beforeç–‘ä¼¼è¦ç´ ＋ afterç–‘ä¼¼è¦ç´ を組ã¿åˆã‚ã›ã¦ã€ãƒã‚§ãƒƒã‚¯ã•ã‚ŒãŸæ™‚ã®ãƒ‡ã‚¶ã‚¤ãƒ³ã‚’作
1
ランã‚ング
ランã‚ング
ランã‚ング
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
処ç†ã‚’実行ä¸ã§ã™
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
{{#tags}}- {{label}}
{{/tags}}