スポンサードリンク

指定サイズ以内の画像幅、高さを算出して適用するjavascript

こんにちは、ころすけ(@wg_koro)です。

タイピング

Webページに画像を載せる際、特定のサイズまで縮小して表示したい時ってありますよね。例えば幅200px、高さ300pxの画像を、幅150pxにして表示させたい…とか。

こんな時、

と書けば、表示上は幅150pxになります。高さは「幅150px」に合ったサイズへ自動で縮小されます。

では、この時、幅150px, 高さ150pxのコンテナに収まるような画像にするには?

安直に

としてしまうと、変な縮尺になり画像が崩れてしまいます。こんな時は自分で幅と高さを計算するしかありません。

・・・正直面倒くさいですね。こんな時に使えるスクリプト作りました。

指定幅、高さを指定すると、その範囲内で縮尺をキープしたサイズを適用してくれるスクリプトです。

resize.js (Gists)

ご自由にお使い下さい(・ω・)ノ

Facebookページ / スポンサードリンク
2013-05-07 | Posted in ProgramNo Comments » 
Comment





Comment



スパム対策のため、コメントする際は下記の計算式を埋めてください。 計算式の有効期限が切れました。計算式の隣にある再読み込みボタンを押してください。