カテゴリー:
画像
閲覧数:622 配信日:2015-08-05 21:10
表
実装案毎の機能比較一覧表
| - | 方式 | CSS | JS | 依存ライブラリ | キーワード |
|---|---|---|---|---|---|
| 案1-1 | Media Queries | 〇 | - | - | @media、min-width、max-width、display: none;、display: block; |
| 案1-2 | Media Queries | 〇 | - | - | @media、min-width |
| 案2-A-1 | Viewport幅 | - | - | picturefill.js | sizes="100vw"、srcset属性、w記述子 |
| 案2-A-2 | Viewport幅 | - | - | picturefill.js | sizes="★★vw"、srcset属性、w記述子 |
| 案2-A-3 | Viewport幅 | - | - | picturefill.js | sizes="(min-width: ☆☆px) ★★vw"、srcset属性、w記述子 |
| 案3-B | pictureタグ | - | - | picturefill.js | picture、source media="(min-width: ☆☆px)" srcset="■■.jpg" |
| 案5-1 | window.innerWidth | - | 〇 | - | window.innerWidth |
| 案5-2 | window.matchMedia | - | 〇 | - | window.matchMedia |