[JS]幅広ã„ブラウザをサãƒãƒ¼ãƒˆï¼è¡¨ç¤ºã‚µã‚¤ã‚ºã«æœ€é©ãªç”»åƒãƒ»èƒŒæ™¯ç”»åƒã‚’表示ã™ã‚‹ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ã®è»½é‡ã‚¹ã‚¯ãƒªãƒ—ト -RimgページãŒèªã¿è¾¼ã¾ã‚ŒãŸæ™‚ã«DOMを調査ã—ã¦imgè¦ç´ を自動ã§æŽ¢ã—ã€è¨å®šã—ãŸãƒ–レイクãƒã‚¤ãƒ³ãƒˆã«å¿œã˜ã¦æœ€é©ãªç”»åƒãƒ•ã‚¡ã‚¤ãƒ«ã‚’表示ã™ã‚‹ã‚¹ã‚¯ãƒªãƒ—トを紹介ã—ã¾ã™ã€‚ SVGã¨PNGãŒæ··åœ¨ã—ã¦ã„るページã§ã‚‚ç„¡å•é¡Œã€SVGã¯ãƒ™ã‚¯ã‚¿ãƒ¼ãªã®ã§ãã®ã¾ã¾æ‹¡å¤§ã€PNGã¯ãã®ã‚µã‚¤ã‚ºç”¨ã®ç”»åƒãƒ•ã‚¡ã‚¤ãƒ«ã‚’表示ã™ã‚‹è³¢ã„仕様ã«ãªã£ã¦ã„ã¾ã™ã€‚ Rimg -GitHub Rimgã®ç‰¹å¾´ Rimgã®ãƒ‡ãƒ¢ Rimgã®ä½¿ã„æ–¹ Rimgã®ç‰¹å¾´ 100%フãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã®ã‚³ãƒ¼ãƒ‰ï¼ˆãƒãƒƒã‚¯ã‚¨ãƒ³ãƒ‰ã¯ä¸€åˆ‡ç„¡ã—）。 å˜ç‹¬ã§åˆ©ç”¨ã§ãるスクリプトã€jQueryãªã©ã¯å¿…è¦ã‚ã‚Šã¾ã›ã‚“。 ã—ã‹ã‚‚ã€è¶…軽é‡ï¼ˆ6.0KB）。 UA判定やクッã‚ーãªã©ã€ç’°å¢ƒã«ä¾å˜ã—ã¦åˆ¤å®šã™ã‚‹ã‚‚ã®ã¯ä½¿ç”¨ã—ã¦ã„ã¾ã›ã‚“。 ç”»åƒã‚„背景画åƒã‚’レスãƒãƒ³ã‚·ãƒ–対応ã«ã—ã€æœ€é©ãªç”»åƒã‚’表示ã—ã¾ã™ï¼ˆRetinaディスプレイã€ãƒªã‚µã‚¤ã‚ºå¯¾å¿œï¼‰ã€‚ スクãƒãƒ¼ãƒ«ã—ã¦ç”»åƒãŒè¡¨ç¤ºã•ã‚ŒãŸã‚‰ãƒãƒ¼ãƒ‰ã™ã‚‹Lazy Loadã«å¯¾å¿œã€‚ ス
![[JS]幅広ã„ブラウザをサãƒãƒ¼ãƒˆï¼è¡¨ç¤ºã‚µã‚¤ã‚ºã«æœ€é©ãªç”»åƒãƒ»èƒŒæ™¯ç”»åƒã‚’表示ã™ã‚‹ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ã®è»½é‡ã‚¹ã‚¯ãƒªãƒ—ト -Rimg](https://cdn-ak-scissors.b.st-hatena.com/image/square/7216083dac49099812cea7a817f39a5b9988bd38/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201501%2F2015021301.png)
[CSS]一ã¤ã®è¦ç´ ã«èƒŒæ™¯ã‚„ボーダーをマルãƒãƒ—ルã«é…ç½®ã™ã‚‹å®Ÿç”¨çš„ãªãƒ†ã‚¯ãƒ‹ãƒƒã‚¯
背景ã«å‹•ç”»ã‚’使ã£ãŸã‚µã‚¤ãƒˆãŒæ‰‹è»½ã«ä½œã‚Œã‚‹ Vide
コピペã§ä½¿ãˆã‚‹ï¼ CSSã§å‡ã£ãŸèƒŒæ™¯ã‚’作るサンプル集 | ライフãƒãƒƒã‚«ãƒ¼ãƒ»ã‚¸ãƒ£ãƒ‘ン
[CSS]OS X Yosemiteã®ã‚ˆã†ã«èƒŒæ™¯ãŒé€ã‘る美ã—ã„パãƒãƒ«ã‚’実装ã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆ
スクリプト無ã—ã€å‹•ç”»ã‚’ページã®èƒŒæ™¯ã„ã£ã±ã„ã«è¡¨ç¤ºã™ã‚‹æ–¹æ³•
æ–°ç€è¨˜äº‹
背景画åƒç”¨ã®ã¡ã‚‡ã£ã¨é¢ç™½ã„タイル状ã®ãƒ‘ターンãŒä½œæˆã§ãã‚‹ -TILIZE
商用利用無料ã€ãƒ”クセルベースã§ä½œã‚‰ã‚ŒãŸå°ã•ãªå°ã•ãªãƒ‘ã‚¿ãƒ¼ãƒ³ç´ æ -14 Pixel Patterns
å…¨ã¦å•†ç”¨åˆ©ç”¨ç„¡æ–™ï¼ã™ãã«ä½¿ãˆã‚‹JPEGç´ æã‹ã‚‰ã‚ªãƒªã‚¸ãƒŠãƒ«ã‚’作æˆã§ãã‚‹PSDã¾ã§ãƒ–ラーãªèƒŒæ™¯ç´ æã®ã¾ã¨ã‚
[CSS]背景ã«åˆ‡ã‚Šè¾¼ã¿ã‚’ã„ã‚Œã¦ã€ãƒ‘ãƒãƒ«ã®å››éš…ã‚’ç•™ã‚ã‚‹CSS3ã®ç¾Žã—ã„エフェクト -CSS3 tucked corners
[CSS]ç”»åƒã‚’使用ã›ãšã«ã€èƒŒæ™¯ã‚’ストライプやãƒã‚§ãƒƒã‚¯æŸ„ã«ã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆ | コリス
[CSS]背景画åƒã«é–¢ã™ã‚‹å®Ÿç”¨çš„ãªã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆã®ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯é›†
[JS]高性能ã§è¨ç½®ã‚‚ç°¡å˜ã€ãƒ–ãƒ©ã‚¦ã‚¶æž ã„ã£ã±ã„ã«èƒŒæ™¯ç”»åƒã‚’é…ç½®ã™ã‚‹ã‚¹ã‚¯ãƒªãƒ—ト -bgStretcher
継ãŽç›®ã®ãªã„背景画åƒã‚’作æˆã™ã‚‹Photoshopã®ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ« | コリス
背景画åƒã‚’ブラウザã®æž ã„ã£ã±ã„ã«è¡¨ç¤ºã™ã‚‹ãƒ†ã‚¯ãƒ‹ãƒƒã‚¯ã®è€ƒå¯Ÿ
美ã—ã„åŠé€æ˜Žã®ãƒ‘ãƒãƒ«ã‚’ç°¡å˜ã«ä½œæˆã§ãã‚‹Photoshopã®ã‚¹ã‚¿ã‚¤ãƒ«ã®ã¾ã¨ã‚
[CSS]JavaScriptç„¡ã—ã€ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ã€èƒŒæ™¯ã‚’コンテンツã®ã‚¹ã‚¯ãƒãƒ¼ãƒ«ã«åˆã‚ã›ã¦å¤‰æ›´ã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆ
ç„¡æ–™ã§å¤§é‡ã®èƒŒæ™¯ãƒ†ã‚¯ã‚¹ãƒãƒ£ã‚’ダウンãƒãƒ¼ãƒ‰ã§ãるサイト「Subtle Patternsã€
BigVideo.js
{{#tags}}- {{label}}
{{/tags}}