HTML5-canvas让画布在画布内闪烁

我在画布内画了几个小圆圈（填充了红色）作为标记，现在我希望他们眨眼就是我没有成功。请任何人帮忙，我卡住了。HTML5-canvas让画布在画布内闪烁

var X = 135; 
var Y = 70; 

function button() { 
    var butt = c.getContext("2d"); 
    butt.beginPath(); 
    butt.arc(X, Y, 4, 0, 2 * Math.PI); 
    butt.fillStyle = "#FF0000"; 
    butt.fill(); 
    butt.stroke(); 
    butt.css('visibility', butt.css('visibility') === 'hidden' ? '' : 'hidden') 
} 
button(); 
button(X = 200, Y = 100); 
button(X = 280, Y = 200);

来源

2013-10-02 Aditya

显示你曾尝试过什么？ –

var X = 135; var Y = 70; function button（）{ var butt = c.getContext（“2d”）; butt.beginPath（）; butt.arc（X，Y，4，0，2 * Math.PI）; butt.fillStyle =“＃FF0000”; butt.fill（）; butt.stroke（）; } button（）;（）;（）;（）; 按钮（X = 200，Y = 100）; 按钮（X = 280，Y = 200）; – Aditya

对不起，我只是不知道如何添加我的程序在这里，我是一个初学者在这里... – Aditya

首先你必须对你的函数做两处修改。传入参数并返回对按钮的引用。

function button(X, Y) { 
    var butt = c.getContext("2d"); 
    butt.beginPath(); 
    butt.arc(X, Y, 4, 0, 2 * Math.PI); 
    butt.fillStyle = "#FF0000"; 
    butt.fill(); 
    butt.stroke() 
}

这允许您创建的按钮像这样并保持一个参考：

b1 = button(135, 70); 
b2 = button(200, 100); 
b3 = button(280, 200);

然后，您可以创建一个切换可见性的功能，并调用它像

function toggle_button(items){ 
    items.forEach(function(item) { 
     item.css('visibility', item.css('visibility') === 'hidden' ? 'visible' : 'hidden') 
    }); 
    setTimeout(function toggle_buttons(items),500); 
} 

setTimeout(function toggle_buttons([b1, b2, b3]),500);

为了闪烁，函数toggle_buttons必须设置超时本身以保持闪烁。

来源

2013-10-02 04:30:03

非常感谢你们。 @Naveed这是真正的激励。以及如何让他们眨眼，我需要他们眨眼'隐藏的可见性不适合我。 – Aditya

@Aditya当然''butt.css（'visibility'，butt.css（'visibility'）==='hidden'？''：'hidden'）'行必须进入切换功能。我编辑我的答案。 –

谢谢@洛伦兹我明白了代码，它真的很有帮助。 – Aditya

HTML5-canvas让画布在画布内闪烁

回答

相关问题