問題是我希望箭頭去行和列，但只在列上
html
<div class="grafica" id="grafica">
<div id="x"></div>
<div id="y"></div>
</div>
css
.grafica{
width: 90%;
height: 95vh;
box-shadow: 7px 10px 30px -1px black;
}
每個箭頭都在 div 內部，如果我不將箭頭放在 div 內部，它作業得很好，但我需要這樣做
javascript
function createArrow(){
const div = document.createElement('div');
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = 100;
canvas.height = 100;
canvas.className = 'arrow';
ctx.beginPath();
ctx.strokeStyle = 'black';
ctx.lineWidth = 3;
ctx.moveTo(50, 50);
ctx.lineTo(0, 0);
ctx.moveTo(20, 10);
ctx.lineTo(0, 0);
ctx.lineTo(10, 20);
ctx.stroke();
document.addEventListener('mousemove', ()=> {
let distanceX = getDistanceBetweenElements(canvas, x);
let distanceY = getDistanceBetweenElements(canvas, y);
let f1 = (k*q1*q2)/distanceX;
let f2 = (k*q1*q2)/distanceY;
console.log(f1, f2);
//canvas.style.transform = `rotate(${a}deg)`;
});
grafica.append(div);
div.append(canvas);
}
uj5u.com熱心網友回復：
請將以下代碼添加到您的 css 中：
.grafica > div {
float: left;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/528983.html