我用帆布画做了一个倒计时
工作代码:http://jsfiddle.net/ajFsx/
- window.onload = function() {
- canvas = document.getElementById('timer'),seconds = document.getElementById('counter'),ctx = canvas.getContext('2d'),sec = 180,countdown = sec;
- ctx.lineWidth = 8;
- ctx.strokeStyle = "#528f20";
- var
- startAngle = 0,time = 0,intv = setInterval(function(){
- var endAngle = (Math.PI * time * 2 / sec);
- ctx.arc(65,35,30,startAngle,endAngle,false);
- startAngle = endAngle;
- ctx.stroke();
- countdown--;
- if ( countdown > 60){
- seconds.innerHTML = Math.floor(countdown/60);
- seconds.innerHTML += ":" + countdown%60;
- }
- else{
- seconds.innerHTML = countdown;
- }
- if (++time > sec,countdown == 0 ) { clearInterval(intv),$("#timer,#counter").remove(),$("#timers").prepend('<img id="theImg" src="#" />'); }
- },10);
- }
我的问题是以下如何让这张图更好看,所以没有像素?
我在jquery画布上搜索了很多,但我似乎无法找到我正在寻找的地方.