対象エレメントのサイズを取得するプログラムですが、posと合わせて、1つのエレメントの座標で左上のポイントを取得し、サイズを取得する事で右下ポイントが取得できる。
概要
IE6などの旧IEにも対応。
仕様
param @ e : サイズを取得したいエレメント
return @ [type:json] {x:幅,y:高さ}
コード
(function(){
var $$={};
//指定したエレメントのサイズを取得
$$.size = function(e){
//対象element
if(typeof(e)=='undefined'){
if (navigator.userAgent.match("MSIE")&&document.compatMode!='BackCompat'){
e = document.documentElement;
}
else{
e = document.getElementsByTagName("body")[0];
}
}
//サイズ取得;
var size={
x:e.offsetWidth,
y:e.offsetHeight
};
//子階層依存※下に1つのみの子を持つ場合サイズチェックを行う;
if(e.childNodes.length==1 && e.tagName=='A'){
var chk ={
x:e.childNodes[0].offsetWidth,
y:e.childNodes[0].offsetHeight
};
if(chk.x > size.x){
size.x = chk.x;
}
if(chk.y > size.y){
size.y = chk.y;
}
}
return size;
};
//グローバル変数へ格納
window.$$LIB = $$;
//プログラム構造を返す(別変数に格納できる)
return $$;
})();
使い方
var elm_size = $$LIB.size(document.getElementById("hoge"));
//幅と高さが表示される。※コンソール表示はサンプルです。
console.log(elm_size.x +" / "+ elm_size.y);