サイズが不明でバラバラな複数の画像を指定サイズにトリミングして配置したり、画像全体が収まるように配置することもできるjQueryのプラグインを紹介します。 ImageFit ImageFit -GitHub ImageFitのデモ ImageFitの使い方 ImageFitのデモ デモはサイズがバラバラな画像が6枚、それぞれ同じサイズの矩形に配置します。 下のキャプチャは同じサイズの画像のように見えますが、既にトリミングして配置された状態です。
画像の長い辺に合わせて、フィット Image Scaleの使い方 Step 1: 外部ファイル head内にjquery.jsと当スクリプトを外部ファイルとして記述します。 <head> ... <script src="jquery.js" type="text/javascript"></script> <script src="image-scale.js" type="text/javascript"></script> </head> Step 2: HTML 大きさを調整したい画像に「class=scale」を加えます。 <div class="image-container"> <img class="scale" src="img/example.jpg"> </div> さらに、画像の位置などを設定する場合はdata属性を加えます。 <div class="image-c
イメージ画像 ../img/001.jpg ページ内コンテンツ #MW01?width=200&height=200 外部HTML ../auto_visual_switch/index.html?width=300&height=300 外部HTMLのID指定 ../auto_visual_switch/index.html#contents?width=600&height=400&scroll=yes イメージ画像(Not Found) ../img/not_found.jpg ページ内コンテンツ(サイズ未指定) #MW01 外部HTMLのID指定(サイズ未指定) ../auto_visual_switch/index.html#contents?scroll=yes 外部HTML(サイズ未指定) ../auto_visual_switch/index.html
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く