http://www.colmin.xyz/entry/2017/01/25/144450
å°ã•ãªå·¥å¤«ãŒå…‰ã‚‹ã€ãƒ†ã‚ストリンクã®Hoverアニメーションå‚考集 | æ ªå¼ä¼šç¤¾LIG(リグ)｜DX支æ´ãƒ»ã‚·ã‚¹ãƒ†ãƒ 開発・Web制作
ã“ã‚“ã«ã¡ã¯ã€ãƒ‡ã‚¶ã‚¤ãƒŠãƒ¼ã®ãºã¡ã“ã§ã™ã€‚ è¿‘é ƒã¯ã„ã‚ã„ã‚ãªå‹•ãã‚’å–り入れãŸã‚µã‚¤ãƒˆãŒå¢—ãˆã¦ã„ã¦ã€ã€ŒWebã£ã¦æ¥½ã—ã„ã€ã¨ã„ã†ãƒ¯ã‚¯ãƒ¯ã‚¯ãŒä»Šã¾ã§ä»¥ä¸Šã«æ„Ÿã˜ã‚‰ã‚Œã¾ã™ã€‚ ç§ãŒæœ€è¿‘ã¡ã‚‡ã£ã¨æ°—ã«ãªã£ã¦ã„ã‚‹ã®ã¯ã€ã‚µã‚¤ãƒˆå…¨ä½“ã®å¤§ããªå‹•ãã§ã¯ãªãã€ã„ã¡ãƒ‘ーツã§ã‚る「テã‚ストリンクã€ã®Hoverアニメーションã§ã™ã€‚ 大ããªéƒ¨åˆ†ã®å‹•ãã‚„åŒã˜ãƒªãƒ³ã‚¯ã§ã‚‚ç›®ã«ã¤ãã‚„ã™ã„ボタンリンクã«ã¯ã€ã„ã‚ã„ã‚ãªãƒãƒªã‚¨ãƒ¼ã‚·ãƒ§ãƒ³ã®å‹•ããŒå–り入れられã¦ã„ã¾ã™ã€‚一方ã§ãƒ†ã‚ストリンクã«ã¤ã„ã¦ã¯ã€ã‚ã‚ŠããŸã‚Šãªã‚¨ãƒ•ã‚§ã‚¯ãƒˆã«ãªã£ã¦ã—ã¾ã£ã¦ã„るサイトãŒã¾ã ã¾ã 多ã„ãªãã€ã¨æ€ã‚ã‚Œã¾ã™ã€‚ ãã‚“ãªä¸ã§ã€ãã†ã„ã£ãŸäº›ç´°ãªéƒ¨åˆ†ã‚‚手を抜ã‹ãšä½œã‚Šè¾¼ã¾ã‚Œã¦ã„るサイトを見るã¨ã€æ€ã‚ãšã€ŒãŠã£ï¼ã€ã¨ç«‹ã¡æ¢ã¾ã£ã¦ã—ã¾ã„ã¾ã™ã€‚ サイトコンセプトã«æ²¿ã£ãŸåŠ¹æžœçš„ãªã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã‚’入れるã“ã¨ãŒã§ãã‚Œã°ã€ãƒ¯ãƒ³ãƒ©ãƒ³ã‚¯ä¸Šã®Webサイトã«ãªã£ã¦ã„ãã¯ãšã€‚ ã¨ã„ã†ã‚ã‘ã§ä»Šå›žã¯ã€ãƒ†ã‚ストリンクã®Ho
ã“ã‚Œçµæ§‹ä½¿ãˆãŸï¼ã‚µãƒ¼ãƒ“スサイトやWordPressテーマã§ä½¿ã‚ã‚Œã¦ã„ã‚‹å°æŠ€ã¾ã¨ã‚
作æˆï¼š2014/05/19 更新：2014/11/01 WordPress > ウェブサービスサイトや最近ã®WordPressテーマã§ä½¿ã‚ã‚Œã¦ã„るエフェクトやå°æŠ€ã‚’ã¾ã¨ã‚ã¾ã—ãŸã€‚今回ã¾ãŸjQueryãŒå¤šããªã£ã¦ã—ã¾ã„ã¾ã—ãŸãŒã€ã‚µã‚¤ãƒˆåˆ¶ä½œæ™‚ã«ä¸€æ‰‹é–“åŠ ãˆãŸããªã‚‹å°æŠ€é›†ã§ã™ã€‚ ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢é€Ÿå ±ã¯ Twitter ã®@commteã§é…ä¿¡ã—ã¦ã„ã¾ã™ã€‚ ã‚‚ã㘠サイトèªã¿è¾¼ã¿æ™‚ １．画åƒèªã¿è¾¼ã¿æ™‚ã€ãƒãƒ¼ãƒ‡ã‚£ãƒ³ã‚°ç”»åƒã‚’表示ï¼jQuery ２．èªã¿è¾¼ã¿æ™‚ã«æ–‡å—ã‚’å‹•ã‹ã™ï¼jQuery ヘッダー ３．文å—ã®æ‹¡å¤§ãƒ»ç¸®å°ï¼jQuery ４．入力補助ï¼jQuery ５．伸縮ã™ã‚‹ã‚µãƒ¼ãƒãƒœãƒƒã‚¯ã‚¹ï¼jQuery コンテンツ ６．ä¸å¿ƒã«æ°´å¹³ç·šã‚’入れるï¼CSS ７．å‡ç‰ã«ä¸¦ã¹ã‚‹ï¼æ®µçµ„ã¿ï¼CSS ８．コンテンツãŒç¾ã‚ŒãŸæ™‚ã«ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã•ã›ã‚‹ï¼jQuery ９．マウスホãƒãƒ¼ã§ç”»åƒã‚’拡大ã—ã‚ャプションを出ã™ï¼jQuery １ï¼ï¼Žãƒž
1
ランã‚ング
ランã‚ング
ランã‚ング
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
処ç†ã‚’実行ä¸ã§ã™
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
{{#tags}}- {{label}}
{{/tags}}