请问一下大神们，我这个如何让他像抽奖那样旋转，麻烦了，还有水印是怎么搞得，求大神帮一下我

首页课程实战体系课手记专栏慕课教程

请问一下大神们，我这个如何让他像抽奖那样旋转，麻烦了，还有水印是怎么搞得，求大神帮一下我

<!DOCTYPE html>

<html>

<head>

<style>

div{

width: 500px;

height: 500px;

margin: 0 auto;

}

</style>

</head>

<body>

<div>

</div>

var can=document.getElementById("can");

var cans=can.getContext("2d");

var btn=document.getElementsByTagName("button");

function ar(){

btn.onclick=function(){

can.style="transform:rotate(8550deg)";

cans.beginPath();

cans.arc(250,250,200,0,360*Math.PI/180);

cans.fillStyle="green";

cans.stroke();

cans.fill();

for(var i=0;i<6;i++){

cans.save();

cans.beginPath();

cans.translate(250,250);

cans.rotate(60*i*Math.PI/180);

cans.moveTo(0,0);

cans.lineTo(0,200);

cans.lineWidth=5;

cans.stroke();

cans.closePath();

cans.restore();

}

cans.save();

cans.beginPath();

cans.translate(250,250);

cans.arc(0,0,30,0,360);

cans.fillStyle="red";

cans.fill();

cans.restore();

cans.beginPath();

cans.moveTo(230,230);

cans.lineTo(170,170);

cans.lineWidth="20";

cans.stroke();

cans.closePath();

cans.fillStyle="red";

cans.fillText("一等奖",150,150);

cans.fillStyle="red";

cans.fillText("二等奖",300,150);

cans.fillStyle="red";

cans.fillText("三等奖",300,350);

cans.fillStyle="red";

cans.fillText("特等奖",350,250);

cans.fillStyle="red";

cans.fillText("再来一次",170,350);

cans.fillStyle="red";

cans.fillText("谢谢惠顾",100,250)

}

ar();

setInterval("ar()",1000)

</script>

</div>

</body>

</html>

未来靠自

浏览 857回答 1

1回答

随时随地看视频慕课网APP