absoluteで重なるとき右に避けて表示したい
より賢い解決策を探しています。
"float: left"などでは、横に並ぶ要素のwidthが親を超えると下段にずれると思います。例えば下記のように。
<div style="width:100px">
<div style="width:40px;float:left">test</div>
<div style="width:40px;float:left">test</div>
<div style="width:40px;float:left">test</div>
<div style="clear:both"><!--とりあえず--></div>
</div>
これは横並びですが、訳あって"position:absolute"を使って表示し、要素が重なる場合は、右に避けて表示をしたいのです。(もちろん各要素のtopとleftを指定します)
これを行うために、JavaScriptで配置状態を管理する配列を用意しました。下記のようなテーブルです。
[
[0,0,0,0,0,0,0,0,0],
[0,0,0,1,1,0,0,0,0],
[0,0,0,1,1,1,1,0,0],
[0,0,0,0,0,1,1,0,0],
[0,0,0,0,0,1,1,0,0]
]
"bottom - top"または"right - left"のいずれかの位置に"1"があるとき、"0"の場所まで右にずれる、というものです。
このうち"1"と"0"を for で探しているのですが、最大で要素のサイズ分だけ調べる回数がある、ただの力技です。
for(var i=y, j; i<y1; i++){
for(j=x; j<x1; j++){
if(table[i][j]){
// どうのこうの
}
}
}
もしかすると賢い解決策があるんじゃないかということで、質問させていただきました。
よろしくお願いします。