Question

在我的Javascript代码中，我有这个变量：让rect = this.canvas.getBoundingClientRect（）;

此变量是必需的，以模态显示画布。

但是在我的HTML页面上，我有一个具有相对位置的滑块（透孔）。而且由于我有这个相对位置，所以我的Canvas不显示在我的mdodal中。

我的腹透的CSS：

SELECT TOP 1 deqs.last_elapsed_time AS [Elapsed Time],
             deqs.last_physical_reads AS [Physical Reads],
             deqs.last_logical_reads AS [Logical Reads],
             deqs.last_logical_writes AS [Logical Writes],
             deqs.last_worker_time AS [CPU Time] 
FROM sys.dm_exec_query_stats AS deqs 
CROSS APPLY sys.dm_exec_sql_text(deqs.sql_handle) AS dest 
WHERE dest.text not like '%sys.%' 
ORDER BY deqs.last_execution_time DESC

带有getBoundingClientRect的Java脚本的一部分：

#diaporama {
    position: relative;

}

您可以在此处查看HTML页面： http://p4547.phpnet.org/bikes/index.html

如何保持相对位置并使我的Signature画布正常工作？

Answer 1

问题解决了。

我这样编辑JS代码：

    updateMousePosition(mX, mY) {
        let rect = this.canvas.getBoundingClientRect(); // renvoie la taille d'un élément et sa position relative par rapport à la zone d'affichage (viewport)
        let left   = rect.left   + window.scrollX;
      let top    = rect.top    + window.scrollY;
        let scaleX = this.canvas.width / rect.width;
        let scaleY = this.canvas.height / rect.height;
        this.cursorX = (mX - left) * scaleX;
        this.cursorY = (mY - top) * scaleY;
    }

getBoundingClientRect和相对位置之间的冲突

1 个答案: