我有一个canvas tube1Ctx和一个ID为sineWave的div,使用纯JavaScript在鼠标拖动下旋转了画布,现在我需要相对于画布同时旋转div(相同的角度位移)。当我尝试使用以下代码时,拖动旋转画布时变换样式不会更新。谁能帮我解决。提前致谢

function tubeRotate(e){

if (moveFlag2){

tube1XPos = e.clientX - tube1Canvas.offsetLeft;
tube1YPos = e.clientY - tube1Canvas.offsetTop;


rotate = tube1XPos-((e.clientX-tube1Canvas.offsetLeft));
rotate = (Math.atan(240/rotate))* Math.PI / 180;
tube1Ctx.clearRect(240,10,tube1Canvas.width,tube1Canvas.height);
tube1Ctx.translate(275, 10);
tube1Ctx.rotate(rotate);
tube1Ctx.translate(-275,-10 );
tube1Ctx.drawImage(tube1Img,240 , 10 , 46 , 235 );


    var angle=rotate;

document.getElementById("sineWave").style.MozTransformOrigin='0% 0%';
document.getElementById("sineWave").style.MozTransform =  'rotate('+angle+'rad)';

document.getElementById("sineWave").style.webkitTransformOrigin='0% 0%';
document.getElementById("sineWave").style.webkitTransform = 'rotate('+angle+'rad)';


}

最佳答案

缺少报价

document.getElementById(“ sineWave).style.MozTransformOrigin ='0%0%';

关于javascript - 我如何相对于在mousedrag上旋转的 Canvas 旋转div,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/10088197/

10-12 13:41