css - CSSで背景の不透明度を設定する

Question

cssで要素の背景を半透明にしたい。を使用してこれを行う方法があることを認識しています

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

しかし、Rails アプリケーションで CSS を動的に作成しようとしています。使用している変数は 16 進コードです。16 進コードをパラメーターとして使用できる rgba() に相当するものはありますか?

Answer 1

ここで 16 進コードを RGB に変換できます: http://www.javascripter.net/faq/hextorgb.htm

編集：

その後、彼はルビーでそれを行うことができます。

16 進文字列を受け取る関数を作成し、文字列を 3 つの部分に分割し、各部分を次のように変換します。

hex_part = "ff"    
hex_part.to_i 16

編集2：

hex = "ff88­00"
hex_parts = hex.s­can(/.{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_p­arts.join(­",")  // Join the parts with a "," and you will get "255,136,0".

Answer 2

たとえば、class="opac" を使用して要素を div タグで囲む場合、そのように jQuery を使用できます。

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

これにより、特定のイベントがトリガーされたときに「opac」オブジェクトの不透明度が 20% になります。たとえば、Add_Something でタグ付けされた div 内のリンクがクリックされた場合です。

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

「500」は、オブジェクトが半透明になる速度です...