ボタンを綺麗ã«ä¿®é£¾ã—ã¦ãれるライブラリ「sexybuttonsã€:phpspot開発日誌
ボタンを綺麗ã«ä¿®é£¾ã—ã¦ãれるライブラリ「sexybuttonsã€ã€‚ 次ã®ã‚ˆã†ã«ãƒ‡ãƒ•ã‚©ãƒ«ãƒˆã®ãƒœã‚¿ãƒ³ã‚’綺麗ã«ä¿®é£¾ã—ã¦ãã‚Œã¾ã™ã€‚ デフォルトボタン 修飾後ボタン ä»–ã«ã‚‚色々ãªãƒœã‚¿ãƒ³ã«å¤‰æ›´ã™ã‚‹ã“ã¨ãŒã§ãã¾ã™ã€‚ サãƒãƒ¼ãƒˆãƒ–ラウザã¯ä»¥ä¸‹ã¿ãŸã„ã§ã™ Mozilla Firefox 3.5 Internet Explorer 6+ Safari 4 Google Chrome Opera 10 以下ã®ã‚µã‚¤ãƒˆã‚’å‚ç…§ã—ã¦ãã ã•ã„。 sexybuttons - Project Hosting on Google Code
セクシーãªãƒœã‚¿ãƒ³ã§ãƒ¦ãƒ¼ã‚¶ãƒ“リティをå‘上ã™ã‚‹Â·Sexy Buttons MOONGIFT
Sexy Buttonsã¯JavaScript/CSS製ã®ã‚ªãƒ¼ãƒ—ンソース・ソフトウェア。Webサイトã®ãƒ¦ãƒ¼ã‚¶ãƒ“リティをå‘上ã™ã‚‹ä¸Šã§è€ƒãˆãŸã„ã®ãŒã‚¢ã‚¤ã‚³ãƒ³ã®ä½¿ã„æ–¹ã ã€‚ç´ ã£æ°—ãªã„æ–‡å—ã ã‘ã®è¡¨ç¤ºã«æ¯”ã¹ã¦è¡¨ç¾åŠ›ãŒé«˜ããªã‚Šã€ãƒ¦ãƒ¼ã‚¶ãƒ“リティも大幅ã«å‘上ã™ã‚‹ã€‚ アイコン付ãã®åˆ†ã‹ã‚Šã‚„ã™ã„ボタン Webサイトã«ãŠã„ã¦é‡è¦ãªã®ã¯æœ€å¾Œã«å®Ÿè¡Œã•ã‚Œã‚‹ãƒœã‚¿ãƒ³ã«ã‚ˆã‚‹ã‚¢ã‚¯ã‚·ãƒ§ãƒ³ã 。ãã“を分ã‹ã‚Šã‚„ã™ãã™ã‚Œã°ã‚ˆã‚Šå¤šãã®ãƒ¬ã‚¹ãƒãƒ³ã‚¹ã‚’得られるよã†ã«ãªã‚‹ã¯ãšã 。ãã“ã§å½¹ç«‹ã¤ã®ãŒSexy Buttonsã 。画åƒã§ãƒœã‚¿ãƒ³ã‚’作るよりも簡å˜ã«ã‚¢ã‚¤ã‚³ãƒ³ä»˜ãボタンãŒå®Ÿç¾ã§ãる。 ボタンã¯è§’丸ã«ã—ãŸã‚Šã€è‰²ã‚’変更ã™ã‚‹ã“ã¨ãŒã§ãる。マウスオーãƒãƒ¼æ™‚ã€ã‚¯ãƒªãƒƒã‚¯æ™‚ã«ãã‚Œãžã‚Œè‰²ã‚’変更ã™ã‚‹ã®ã‚‚ç°¡å˜ã«å®Ÿç¾ã§ãる。ボタンã¯6段階ã®å¤§ãã•å¤‰æ›´ã«å¯¾å¿œã—ã¦ã„る。ボタンã®ãƒ©ãƒ™ãƒ«ã¯ãƒ†ã‚ストãªã®ã§ã€å€‹ã€…ã®ãƒœã‚¿ãƒ³ã‚’実ç¾ã™ã‚‹ã®ã¯ãƒ†ã‚ストを変更ã™ã‚‹ã ã‘ã§ã§ãã¦ã—ã¾ã†ã€‚ 大ãã•ã®
CSSã§ä½œã‚‹ã‚·ãƒ³ãƒ—ルã‹ã¤ã‚¯ãƒ¼ãƒ«ãªãƒœã‚¿ãƒ³ã‚µãƒ³ãƒ—ル「Simply-Buttons v2ã€:phpspot開発日誌
CSSã§ä½œã‚‹ã‚·ãƒ³ãƒ—ルã‹ã¤ã‚¯ãƒ¼ãƒ«ãªãƒœã‚¿ãƒ³ã‚µãƒ³ãƒ—ル「Simply-Buttons v2ã€ã€‚ 次ã®ã‚ˆã†ãªä¸¸ã¿ã‚’帯ã³ãŸãƒœã‚¿ãƒ³ã‚„ã€è§’丸ã®ç¶ºéº—ãªãƒœã‚¿ãƒ³ã®ã‚µãƒ³ãƒ—ルãŒãƒ€ã‚¦ãƒ³ãƒãƒ¼ãƒ‰å¯èƒ½ã§ã™ã€‚ CSSã§ã‚¹ã‚¿ã‚¤ãƒªãƒ³ã‚°ã—ã¦ã€æ›´ã«JavaScript ã§æŠ¼ã—ãŸéš›ã®ã‚¤ãƒ¡ãƒ¼ã‚¸åˆ‡æ›¿ãŒè¡Œã‚ã‚Œã¾ã™ã€‚ ボタンを押ã™ã¨ä»¥ä¸‹ã®ã‚ˆã†ã«ãƒœã‚¿ãƒ³ãŒå‡¹ã¿ã¾ã™ã€‚ テã‚ストã¯ãªã‚“ã§ã‚‚ã„ã„ã®ã§æ±Žç”¨ã«ä½¿ãˆã¾ã™ã€‚一度導入ã—ã¦ã—ã¾ãˆã°æ¬¡ã‹ã‚‰ç°¡å˜ã«ç¶ºéº—ãªãƒœã‚¿ãƒ³ãŒè¨ç½®ã§ãã¾ã™ã。 ダウンãƒãƒ¼ãƒ‰ã¯ä»¥ä¸‹ã®ã‚¨ãƒ³ãƒˆãƒªã‚’å‚ç…§ã—ã¦ãã ã•ã„。 Simply-Buttons v2 : p51 Labs
CSSを使ã£ã¦ãƒ•ã‚¡ãƒ³ã‚·ãƒ¼ãªãƒœã‚¿ãƒ³ã‚’作æˆã™ã‚‹ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯:phpspot開発日誌
Make fancy buttons using CSS sliding doors technique This article will show you how to create fancy buttons using CSS sliding doors technique. CSSを使ã£ã¦ãƒ•ã‚¡ãƒ³ã‚·ãƒ¼ãªãƒœã‚¿ãƒ³ã‚’作æˆã™ã‚‹ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯ã€‚ ï¼’æžšã®ç”»åƒã‚’組ã¿åˆã‚ã›ã¦ã€æ¨ªã«ä¼¸ç¸®ã™ã‚‹CSSボタンを作æˆã™ã‚‹ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯ãŒç´¹ä»‹ã•ã‚Œã¦ã„ã¾ã™ã€‚ 自由ãªã‚µã‚¤ã‚ºã«ä¼¸ç¸®å¯èƒ½ ボタンã®ãƒ†ãƒ³ãƒ—レートも色々 サイトパーツã«ä¾¿åˆ©ã«ä½¿ãˆãã†ã€‚ 関連エントリ CSSã§ã‚¯ãƒ¼ãƒ«ãª3Dボタンを作ã‚ㆠCSSã§ã‚¯ãƒ¼ãƒ«ãªINPUTフォームを作æˆã™ã‚‹ã‚µãƒ³ãƒ—ル クãƒã‚¹ãƒ–ラウザã§ã¡ã‚ƒã‚“ã¨å‹•ä½œã™ã‚‹CSSボタン集サイト「CSS Buttons〠CSSã§å‡ºæ¥ãŸã‚·ãƒ³ãƒ—ルã«ä½¿ãˆã‚‹ä¸¸ã£ã“ã„デザインã®ãƒœã‚¿ãƒ³ã‚µãƒ³ãƒ—ル集
MOONGIFT: � クールãªãƒœã‚¿ãƒ³ã‚’作る「ButtonBuilderã€:オープンソースを毎日紹介
アクア風ãªãƒ‡ã‚¶ã‚¤ãƒ³ã®æµè¡Œã‚‚åŽã¾ã£ãŸã‹ã¨æ€ã†ãŒã€ãã‚Œã§ã‚‚様々ãªã‚µã‚¤ãƒˆã§åˆ©ç”¨ã•ã‚Œã¦ã„る。é€æ˜Žæ„Ÿã€ä¸¸ã¿ã®ã‚るデザインãŒã‚¯ãƒ¼ãƒ«ãªã‚µã‚¤ãƒˆã€ãƒãƒƒãƒ—ãªã‚µã‚¤ãƒˆã©ã¡ã‚‰ã«ã‚‚使ãˆã‚‹ã®ãŒä¾¿åˆ©ã 。 ãã‚“ãªã‚¢ã‚¯ã‚¢é¢¨ãƒœã‚¿ãƒ³ã‚’作るTipsã¯å„種ã‚ã‚‹ãŒã€ä¸€ã¤ã®ã‚½ãƒ•ãƒˆã‚¦ã‚§ã‚¢ã ã‘ã§ç°¡å˜ã«çµ‚ã‚らã›ã¦ã—ã¾ã†ã®ãŒã“ã‚Œã 。 今回紹介ã™ã‚‹ã‚ªãƒ¼ãƒ—ンソース・ソフトウェアã¯ButtonBuilderã€ã‚¢ã‚¯ã‚¢é¢¨ãƒœã‚¿ãƒ³ä½œæˆã‚½ãƒ•ãƒˆã‚¦ã‚§ã‚¢ã 。 ButtonBuilderã«ã¯é»’ã€é’ã€ç·‘ã€èµ¤ã€ç™½ã‚’ベースã«ç´°é•·ã€æ¥•å††ã€å››è§’ãªã©æ§˜ã€…ãªå½¢ã®ãƒœã‚¿ãƒ³ãŒç”¨æ„ã•ã‚Œã¦ã„る。後ã¯æ–‡å—色やé…置を決ã‚ã‚Œã°ã”ãç°¡å˜ã«ãƒœã‚¿ãƒ³ãŒå‡ºæ¥ä¸ŠãŒã‚‹ã€‚ å¹ã出ã—風ã®ç”»åƒã‚„鉛ç†ã€ä¸æ¢ãƒœã‚¿ãƒ³é¢¨ã®ç”»åƒã‚‚ã‚ã‚Šã€ãƒœã‚¿ãƒ³ã ã‘ã§ãªã様々ãªç”¨é€”ã§ä½¿ãˆãã†ã 。大ãã•ã‚„å½±ã€å¹…ã€æ–‡å—ã®é…ç½®ã€èƒŒæ™¯è‰²ã€ãƒ•ã‚©ãƒ³ãƒˆã¯è‡ªç”±ã«å¤‰æ›´ã§ãる。 テã‚ストã¯ä¸€è¡Œã«ãªã£ã¦ã„ã‚‹ãŒã€Alt+Enterã§è¤‡æ•°è¡Œã®å…¥åŠ›ãŒå¯èƒ½ã 。サイトã®ã‚¢ã‚¯ã‚»ãƒ³
1
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
IDEA*IDEA 〜 ã¨ã‚るサービスé‹å–¶è€…ãŒå¦ã‚“ã ã“ã¨ã‚’ã¾ã¨ã‚るブãƒã‚°
IDEA*IDEA 〜 ã¨ã‚るサービスé‹å–¶è€…ãŒå¦ã‚“ã ã“ã¨ã‚’ã¾ã¨ã‚るブãƒã‚°
{{#tags}}- {{label}}
{{/tags}}