我有一个关于何时尝试向绘制矩形添加颜色的问题:
ctx.fillStyle = "rgba(0,102,153,1)";
ctx.fillRect(100,100,100,100);
我的绘制矩形中的颜色是浅蓝色,但是当我尝试对不透明度值进行一些修改以使其半透明时:
var opacityVar = 1;
ctx.fillStyle = "rgba(0,102,153,opacityVar/2)";
ctx.fillRect(100,100,100,100);
这根本不起作用,直到我尝试:
var opacityVar = 1;
ctx.fillStyle = "rgba(0,102,153,"+opacityVar/2+")";
ctx.fillRect(100,100,100,100);
这工作正常,我的问题是为什么我需要在我的 opacityVar/2
变量之间添加双 "
标记和 +
?
我正在尝试搜索此内容,但似乎没有有关rgba()
参数表达式的详细信息。有人可以帮助我吗?
最佳答案
ctx.fillStyle
是一个字符串。您正在尝试将 javascript 作为字符串的一部分执行。为此,您必须在字符串之外执行该 javascript,然后将其连接到字符串中。
this is a string -> "rgba(0,102,153,"
this is javascript -> opacityVar/2
this is a string -> ")"
+
将字符串和 JavaScript 结果连接成一个字符串。 "
告诉引擎字符串的开始位置和结束位置。
您还可以使用template literals现在使用 JavaScript。
关于javascript - rgba颜色不透明度动画表达,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44335741/