概要
背景画像(background-image
)のサイズの等倍になるよう要素のサイズを調整します。途中で切れると妙に見えるようなデザインで効果を発揮します。
ダウンロード
基本的な使い方
.gpTile()
を実行すると背景画像のサイズを取得し、背景画像をちょうど表示しきるだけのサイズに変更します。対象要素の現在サイズは下回りません。
$(elem).gpTile();
縦方向だけに適応する場合は、 .gpTile()
にオプションを与えます。
$(elem).gpTile({ direction: 'y' });
デモ
デモ1 : 基本的なもの
- 背景画像がぴったり表示されるようになります。
リファレンス
.gpTile([settings])
settings
… {Object} 設定。以下のキーと値を持てる:direction
… {String}"x"
にすると横方向のみ調節する。"y"
にすると縦方向のみ調節する。"xy"
にすると両方向を調節する。初期値は"xy"
height
… {Number} 画像の高さ。height
,width
の両方を省略した場合は、画像サイズを自動で取得する。width
… {Number} 画像の幅。height
,width
の両方を省略した場合は、画像サイズを自動で取得する。
その他
ライセンス
- MIT License
- 無償で利用できます。商用利用も可能です。
- 転載や改造、再配布が可能です。
- コード内に記載の著作権表示は変更できません。
- どのような問題が発生しても、一切の保証はありません。
利用時に連絡は不要ですが、もしご連絡頂ければ、利用実績として掲載させて頂くかもしれません。
対応ブラウザー
- IE 6以上
- Firefox
- Chrome
- Safari
- Opera