IEでもobject-fitを使えるようにするスクリプト「fitie」

IEでもobject-fitを使えるようにするスクリプト「fitie」

IEでもobject-fitを使えるようにするスクリプト「fitie」
  • シェアしてね♪
  • このエントリーをはてなブックマークに追加
  • follow us in feedly


  • 一式98,000円~の格安プランをご用意!Web制作お任せください!
  • このエントリーをはてなブックマークに追加
  • follow us in feedly

fitieは、IEでもobject-fitを使えるようにするためのスクリプトです。いわゆるポリフィル(Polyfill)というやつですね。

object-fitは、画像や動画を簡単にトリミングすることができる便利なCSSプロパティですが、IEには対応していません。

object-fitの対応ブラウザ

fitieを導入することで、他のブラウザと同じようにIE8~11でもobject-fitが使えるようになります。

スポンサードリンク

fitieの使い方

GitHubからfitieをダウンロードします。distフォルダ内にあるfitie.jsをサーバーにアップして、スクリプトを読み込みます。

<script src="fitie.js"></script>

あとは、通常通りCSSでobject-fitを指定してあげるだけです。


img.cover, video.cover {
  object-fit: cover;
}

あとがき

スクリプトを読み込んであげるだけなので、実装は非常に簡単ですね。

画像などをobject-fitでトリミングをしたい場合は、ぜひ導入をご検討ください。

この記事が気に入ったら
いいね!してね♪

Twitter で
スポンサードリンク

関連記事

コメントを残す

メールアドレスが公開されることはありません。