jQuery画像サイズ変更プラグイン: ImgLiquid

ImgLiquid は、画像がコンテナーに収まるように画像のサイズを変更するための jQuery プラグインです。

特徴

• オプションのレスポンシブ (デフォルト設定は「オフ」)。
• 軽量: gzip 圧縮で 2KB 未満
• 塗りつぶし/切り抜き
• 整列
• コールバック
• SVGのサポート
• オプションのフェードインアニメーション (デフォルト設定は「オフ」)
• すべてのブラウザと互換性があります (ie6 を含む)

なぜ使用するのか?

特にリサイズ時に画像の品質を維持できる非常に優れたプラグインです。縦長でも横長でも、あらゆる形状の画像をアップロードすると、画質が大幅に低下することがよくあるのを目撃したことがあるはずです。そこで、リサイズ時の画質を維持するには、このプラグインが非常に便利です。

使い方？

基本的には、コンテナ内で画像をフィットさせるか、サイズを変更するだけで機能します。カスタマイズも可能です。これを使用する最も簡単な方法は、JavaScript ファイルをインクルードしてからそれを呼び出すことです。例えば、

 //  including the javascript file

$(document).ready(function() { $(".imgLiquidFill").imgLiquid(); // 画像リキッドの呼び出し });

割り当てられた画像が非表示になります。つまり、 () 画像を div の背景に合わせてサイズを変更します。 imageliquid関数を呼び出すときに「fill: true」を選択した場合、つまり ($(“.imgLiquidFill”).imgLiquid(fill: true))、divの背景に画像が収まります。同様に「」を選択した場合も、塗りつぶし: false」と入力すると、アップロードしたときと同じように画像が表示されます。どちらの方法でも、画質は維持されます。