出于某种原因,我必须将我的顶部左侧位置偏移为div。我已经开始创建这个switch语句,并注意到一个模式,当大于3时,将值增加一个数字,然后将下一个值增加最后一个偏移量 - .11。如何简化此代码,可能创建一个公式或其他内容而不是多个case语句?
这是我的代码:
matte_width_value是select语句的值;
switch (matte_width_value)
{
case 2.25:
offset = -.4;
break;
case 2.5:
offset = -.7;
break;
case 2.75:
offset = -1.1;
break;
case 3.25:
offset = 1.35;
break;
case 3.5:
offset = 1.24;
break;
case 3.75:
offset = 1.12;
break;
case 4:
offset = 1.01;
break;
//The cases will increment by .25 until it reaches <6
}
x = (matte_width_value + offset) * ppi; //ppi is defined elsewhere
y = (matte_width_value + offset) * ppi;
这是正在发生的事情的图像(请注意,浅灰色矩形应该直接居中并覆盖黑色矩形,黑色矩形不是div,它是div的背景颜色):
这是html标记:
<div id="mattes" style="width: 247.5px; height: 292.5px; left: 201.25px; top: 23.75px;">
<div id="opening_0" style="background-color: #bfbfbf; position: absolute; left: 63.75px; top: 63.75px; height: 138.75px; width: 93.75px; overflow: hidden; z-index: 4;" ondrop="drop(event, this)" ondragover="allowDrop(event)" onclick="photos_add_selected_fid(this);"> </div>
<canvas id="matte_canvas" width="247" height="292" style="z-index: 3; "></canvas>
</div>
答案 0 :(得分:11)
看起来像查找表的情况。像
var mapping = {
'2.25': -.4,
'2.5': -.7,
// and so forth
};
offset = mapping[ matte_width_value ];
这只是原始问题的解决方案(=简化)。对于实际问题,可能有更好的解决方案。
答案 1 :(得分:0)
matte_width_value = 4;
if (matte_width_value > 3) {
offset =1.35 - (((matte_width_value - 3.25) / .25) * .11);
} else {
switch (matte_width_value)
{
case 2.25:
offset = -.4;
break;
case 2.5:
offset = -.7;
break;
case 2.75:
offset = -1.1;
break;
}
}
document.write(offset);