rgba

Sass/Compass - Convert Hex, RGB, or Named Color to RGBA

强颜欢笑 提交于 2019-11-27 09:48:47
问题 This may be Compass 101, but has anyone written a mixin which sets the alpha value of a color? Ideally, I would like the mixin to take any form of color definition, and apply transparency: @include set-alpha( red, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( #ff0000, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( rgb(255,0,0), 0.5 ); //prints rgba(255, 0, 0, 0.5); 回答1: Use the rgba function built into Sass Sets the opacity of a color. Examples: rgba(#102030, 0.5) =>

How can I stop the alpha-premultiplication with canvas imageData?

梦想的初衷 提交于 2019-11-27 08:42:14
Is there a way to stop the premultiplication of the alpha channel for canvas data, or a workaround? I want to generate an image (in this case some random rgba values) and save the canvas as an image. During the second step, I want to compare the original image with the generated image using the imageData, however this won't work due to the premultiplication of the alpha channel of my rgba pixels in the generated image. The example function drawImage(ctx) { var img = ctx.createImageData(canvas.width,canvas.height); for (var i=img.data.length;i-=4;) { img.data[i] = Math.floor(Math.random() * 255

Is it possible to change only the alpha of a rgba background colour on hover?

别来无恙 提交于 2019-11-27 08:32:39
I have a set of <a> tags with differing rgba background colours but the same alpha. Is it possible to write a single css style that will change only the opacity of the rgba attribute? A quick example of the code: <a href="#"><img src="" /><div class="brown">Link 1</div></a> <a href="#"><img src="" /><div class="green">Link 2</div></a> And the styles a {display: block; position: relative} .brown {position: absolute; bottom: 0; background-color: rgba(118,76,41,.8);} .green {position: absolute; bottom: 0; background-color: rgba(51,91,11,.8);} What I would like to do is write a single style that

White balance (Color Suppression) Formula?

允我心安 提交于 2019-11-27 08:16:47
问题 I need help with a little bit of color math.(RGBA) I'm trying to reduce the amount of green on a character, without actually affecting the green background. Green screen for visual effects. So here is what I have: I have a guy on green screen. Using the expression: g>(r+b)/2 ? (r+b)/2:g Expression says if the green color value is greater than the sum of red and blue divided by 2, then it green will be set to that sum. Running that expression will give me the second image. You can see that the

How to extract r, g, b, a values from CSS color?

只谈情不闲聊 提交于 2019-11-27 06:37:51
问题 What would be the easiest way to transform $('#my_element').css('backgroundColor') to object like this: { r: red_value, g: green_value, b: blue_value, a: alpha_value } ? 回答1: var c = $('body').css('background-color'); var rgb = c.replace(/^(rgb|rgba)\(/,'').replace(/\)$/,'').replace(/\s/g,'').split(','); for(var i in rgb) { console.log(rgb[i]); } Try it here http://jsbin.com/uhawa4 Edit : var c = $('body').css('background-color'); var rgb = c.replace(/^rgba?\(|\s+|\)$/g,'').split(','); for

What is the difference between opacity and that through alpha channel (rgba)?

江枫思渺然 提交于 2019-11-27 05:51:51
问题 div { background-color: rgb(255,0,0); opacity: 1; } div { background-color: rgba(255,0,0,1); } What is the difference between the above two? 回答1: Opacity sets the opacity value for an element and all of its children; While RGBA sets the opacity value only for a single declaration. This is well explained here. http://www.css3.info/introduction-opacity-rgba/ 回答2: Opacity : The opacity property sets the opacity level for an element.(Setting opacity for an elements makes the whole element

Convert RGBA to HEX

浪子不回头ぞ 提交于 2019-11-27 05:27:51
问题 Given a css color value like: rgba(0, 0, 0, 0.86) How do I convert that to a RGB hex value that takes the alpha component into account, assuming a white background? 回答1: Since alpha value both attenuates the background color and the color value, something like this could do the trick: function rgba2rgb(RGB_background, RGBA_color) { var alpha = RGBA_color.a; return new Color( (1 - alpha) * RGB_background.r + alpha * RGBA_color.r, (1 - alpha) * RGB_background.g + alpha * RGBA_color.g, (1 -

Cross browser rgba transparent background while keeping content (text & images) non-transparent

情到浓时终转凉″ 提交于 2019-11-27 00:57:56
问题 I want to get rgba backgrounds working with all browsers. I did some searching and found out that generally there are three types of browsers out there: 1) Browsers that support rgba. 2) Internet Explorer that supports rgba via bizarre '-ms-filter' thing. 3) Browsers that do not support rgba, but I could use base64 png images with 'data URI scheme'. (Even when browser does not support URI scheme, according to this it still could be done.) I have no problems with rgba supporting browsers, and

Overlay a background-image with an rgba background-color

不羁岁月 提交于 2019-11-27 00:55:38
I have a div with a background-image . I want to overlay the background-image with an rgba color ( rgba(0,0,0,0.1) ) when the user hovers the div. I was wondering if there's a one-div solution (i.e. not with multiple divs, one for the image and one for the color, etc.). I tried multiple things: <div class="the-div" id="test-1"></div> <div class="the-div" id="test-2"></div> <div class="the-div" id="test-3"></div> And this CSS: .the-div { background-image: url('the-image'); margin: 10px; width: 200px; height: 80px; } #test-1:hover { background-color: rgba(0,0,0,0.1); } #test-2:hover { background

OpenCV Android Green Color Detection

我们两清 提交于 2019-11-26 22:55:50
currently I'm making an app where user will detect green colors. I use this photo for testing: My problem is that I can not detect any green pixel. Before I worked with blue color and everything worked fine. Now I can't detect anything though I tried different combinations of RGB . I wanted to know whether it's problem with green or my detection range, so I made an image in paint using (0, 255, 0) and it worked. Why it can't see this circle then? I use this code for detection: Core.inRange(hsv_image, new Scalar([I change this value]), new Scalar(60, 255, 255), ultimate_blue); It could have