Question

我一直在玩addon sdk来创建扩展即ie。可以在从互联网网站上找到的图像上画一条线时使用。

扩展程序的工作原理是它使用几个div标签扩展了Internet站点的DOM，这些标记映射到css。

创建一条我曾经使用CSS变换的行

fibotin.draw = function (event) {
    var currentPosX = event.clientX;
    var currentPosY = event.clientY;
    event.preventDefault();
    /* .... */
    if (drawSelection === "line") {
        var length = fibotin.calculateLineLength(currentPosX, currentPosY, drawObj.startPosX, drawObj.startPosY);
        var angle = fibotin.calculateAngle(currentPosX, currentPosY, drawObj.startPosX, drawObj.startPosY);
        var transform = 'rotate(' + angle + 'deg)';

        drawObj.element.style.transform = transform;
        drawObj.element.style.width = length;
    }

在CSS中我已经声明了这个

#line{
transform-origin: 0 100%;
height: 2px; 
background: red; 
position: fixed;
z-index: 999999; 
cursor: move;
}

由于某种原因，此代码不适用于所有网站。（即google.com）但在某些情况下 - 在更简单的网站上 - 它有效（www.stox.fi）

有没有人知道如何解决这个问题，以便它适用于所有网站？

您可以查看我的扩展名为Fibotin

的工作原理

Answer 1

将position设为relative或absolute。这应该使transform工作。 fixed应该让它发挥作用。奇怪的是它不是，也许有什么东西压倒一切？

CSS转换不适用于firefox扩展

1 个答案: