HTML5動效是通過Javascript來實現的。在HTML5中，可以使用Canvas、CSS3和SVG實現動畫效果。下面是一段使用Canvas和Javascript實現動效的代碼：
<!DOCTYPE html><html><head><title>Canvas動效</title><script>window.onload = function() {
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var x = 50;
var y = 50;
var dx = 2;
var dy = 2;
function drawBall() {
context.clearRect(0, 0, canvas.width, canvas.height);
context.beginPath();
context.arc(x, y, 20, 0, Math.PI*2);
context.fillStyle="#0095DD";
context.fill();
context.closePath();
x += dx;
y += dy;
if(x < 0 || x > canvas.width) {
dx = -dx;
}
if(y < 0 || y > canvas.height) {
dy = -dy;
}
}
setInterval(drawBall, 10);
}
</script></head><body><canvas id="myCanvas" width="480" height="320"></canvas></body></html>上述代碼使用Canvas繪制了一個圓形，隨著時間的推移，圓形在畫布內移動，當碰到邊緣時會反彈。這種動畫效果可以通過Javascript的定時器函數setInterval實現。
下一篇下拉框css怎么寫