如何在点击时显示可拖动且可调整大小的矩形并在发布时消失？

Question

截至目前，我在矩形内部有一个动态图形。矩形本身的编码如下：

<rect width="50%" height="100px" class="graph_rect" style="fill:none;pointer-events:all;" </rect>

目前，我没有任何适用于此目标的JavaScript代码。但是，我希望在“graph_rect”之上创建另一个矩形，以便：

• 当我点击“graph_rect”时，这个宽度为0且高度为100px的矩形出现
• 当我拖动时，框宽度将始终等于远离初始点的像素数
• 当我释放鼠标时，它就会消失

Answer 1

向onclick添加graph_rect属性。单击graph_rect后，您可以调用函数切换其visibility。

您还可以使用HTML5的拖放功能来确定拖动元素的时间并相应地调整元素的大小和位置。

https://www.w3schools.com/css/css_display_visibility.asp https://www.w3schools.com/html/html5_draganddrop.asp