Question

我想在css中使元素的背景半透明。我知道有一种方法可以使用

来做到这一点

background-color: rgba(100,100,100,0.5);

但我试图在我的rails应用程序中动态创建css，而我使用的变量是十六进制代码。有没有相当于rgba（）允许我使用我的十六进制代码作为参数？

Answer 1

您可以在此处将十六进制代码转换为rgb：http://www.javascripter.net/faq/hextorgb.htm

编辑：

然后他可以用红宝石做到。

创建一个接受十六进制字符串的函数，将字符串分成三部分并转换为每个部分：

hex_part = "ff"    
hex_part.to_i 16

编辑2：

hex = "ff8800"
hex_parts = hex.scan(/.{1,2}/)
hex_parts[0] = hex_parts[0].to_i 16 // Will make first part to dec.
hex_parts[1] = hex_parts[1].to_i 16
hex_parts[2] = hex_parts[2].to_i 16
dec = hex_parts.join(",")  // Join the parts with a "," and you will get "255,136,0".

Answer 2

如果你将你的元素包含在div标签中，比如说class =“opac”，你就可以这样使用jQuery：

$('.opac).animate({opacity: .2},500);

这将使您的'opac'对象在触发特定事件时的不透明度达到20％，例如，如果点击了标记为Add_Something的div中的链接：

$('#Add_Something a').click(function() {
    $('.opac').animate({opacity: .2}, 500);
});

'500'就是物体变为半透明的速度......

在css中设置背景不透明度

2 个答案: