好的,我使用不透明度0.5的css属性动态地增加了一个空div的宽度,
当鼠标拖动到右边时。我也想增加同一div元素的宽度,当它拖动到左边时(即,宽度达到零以下),我可以绝对确定width的值,但是我想要ui也朝着同一方向发展?任何想法将不胜感激,在此先感谢!
#thing {
position: absolute;
border: 2px dashed #000;
background-color: #fff;
opacity: .2;
z-index: 999999;
}
--
var t = document.getElementById("thing");
//this is performed on mouse drag
t.style.width = Math.abs(x - oldX) + "px"
t.style.height = Math.abs(y - oldY) + "px"
//also the html part
<div id="thing"></div>
当x值小于oldx值(即鼠标拖动到左侧)时,我希望ui更改(宽度和高度的更改)反映到左侧。
最佳答案
这是一个可行的,已评论的解决方案,您可以从中学习(仅针对x轴),该解决方案在Firefox中进行了测试,但可能跨浏览器了。
http://jsfiddle.net/steve/QV6PV/
要直接回答您的问题,您需要同时移动左侧并增加宽度(如代码所示)。
您可以放入一些条件语句来处理最小/最大宽度的问题。另外,可能还需要一个事件处理程序以在单击时触发它。