HTML5 圆形动画，所以看起来它是浮动的答案

【问题标题】：HTML5 circle animate so it looks like it is floatingHTML5 圆形动画，所以看起来它是浮动的
【发布时间】：2012-12-26 23:08:33
【问题描述】：

所以我有点像 html 5 的新手，我试图让一个圆圈看起来像它只是漂浮在那里，所以它不是完全静止的，这可能吗？如果可以的话，你能帮忙吗？以及如何使画布具有 100% 的宽度和 100% 的高度以填满整个屏幕？你需要一个画布来绘制它，否则你会怎么做？

    var canvas = document.getElementById('myCanvas');
    var context = canvas.getContext('2d');
    var centerX = canvas.width / 2;
    var centerY = canvas.height / 2;
    var radius = 70;

    context.beginPath();
    context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
    context.fillStyle = 'green';
    context.fill();
    context.lineWidth = 2;
    context.strokeStyle = '#003300';
    context.stroke();

【问题讨论】：

这是什么意思？你想随意走动吗？如果是这样，为什么不通过随机数 ecah 帧更改 centerX 和 centerY 呢？（即在 -0.5 和 0.5 之间添加一个随机的 # 以便它稍微移动？
不，所以如果你离开它，它会悬停在中间，它会稍微移动，但会在屏幕中间移动，你不能用鼠标移动它
听起来你在描述我建议的行为？

标签： jquery html animation html5-canvas geometry

【解决方案1】：

您可以查看我的问题代码：mouse-over-html-5-canvas-image-in-animation-to-play-pause-it。我问题中的代码与您想要的相同。或许对你有帮助。

【讨论】：