JavaScriptでウィンドウサイズに応じてテーブルのサイズを変更する方法
はじめまして
JavaScriptのウィンドウとテーブルのサイズ変更について質問したいのですが、
onresizeイベントにてウィンドウのサイズを取得して
これに合わせるようにテーブルのサイズも動的に変更したいです。
ただ、条件が2つあるのですが、うまくいきません。
- テーブルは同じ行に2つ隣り合っている。
- 規定のウィンドウ幅まで縮まるとテーブルの幅を縮小しない。
もし、お分かりの方がいらっしゃいましたらご教示いただけませんでしょうか。
海外の製品を使った開発のため、CSSは使えません。
また、規定のウィンドウ幅にいくまでは、ウィンドウの幅とテーブルの間に5px空きを開けるとの要件があります。
ソースは簡単に書くと、下記のようになります。
//規定のウィンドウ幅
var stop_size = 600;
//最小のテーブルサイズ
var min_size = 400;
window.onresize = function() {
// ウィンドウ幅
var windowWidth = window.innerWidth;
if (windowWidth > stop_size) {
// 規定の幅よりもウィンドウサイズが大きければテーブルのサイズを
// ウィンドウサイズ-5pxに指定
} else {
// 規定の幅よりもウィンドウサイズが小さければテーブルのサイズを
// min_sizeのものにする
}
}
上記のソースをテーブルが一つの場合にはうまくいくのですが、
複数あるときにどうしたらよいのかわかりません。
追記
複数ある場合、左のテーブルは規定の幅内なので大きさを変えない。
右のテーブルはウィンドウサイズに合わせて変化させるようにしたいです。