Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #35559

Re: Finding a real background color of an element

Show all headers | View raw

On 03/09/2018 15:09, Thomas 'PointedEars' Lahn wrote:
> Cezary Tomczyk wrote:
> 
>> On 02/09/2018 05:09, Thomas 'PointedEars' Lahn wrote:
>>> Cezary Tomczyk wrote:
>>>> On 29/08/2018 22:12, Thomas 'PointedEars' Lahn wrote:
>>>>> Cezary Tomczyk wrote:
>>>>>> I am trying to figure it out how to determine a real background color
>>>>>> of an element that is visible on the screen.
>>>>> Why?
>>>> To calculate high contrast ratio.
>>> Why?
>>
>> Because I am working on https://www.aslint.org/ and implementing
>> https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html
> 
> Very good.  Then I suggest, too, that you traverse the document tree upwards
> from the target element node:
> 
>    let node = targetElement;
>    do
>    {
>      … document.defaultView.getComputedStyle(node)
>          .getPropertyValue("background-color") …
>    }
>    while ((node = node.parentNode));
> 
> Note that this should return an RGB*A* value *string* for each element in
> the traversal, so in order to obtain the *visible* color, some calculation
> and therefore knowledge of color theory, is required.  For example, you have
> to be able to answer the question “What color, in the RGBA color space, is
> the combination of 50 % skyblue ("rgba(135, 206, 235, 0.5)") on white
> ("rgba(255, 255, 255, 1)") in the subtractive color model?”.

I do traverse up to the body HTML element, but when the body itself 
contains rgba(0, 0, 0, 0) then I can't use it.

> You could use my JSX:dom/css/color.js:jsx.dom.css.Color type to parse that
> string into an object whose numeric properties you can use for the
> calculation.  (The type itself does not provide the required calculation
> methods yet, but it does provide methods for conversion to and from HSL and
> HSV, which should be helpful.  Pull Requests are welcome.)

I do calculations correctly, but the only trouble is to get what's 
really rendered. So, instead rgba(0, 0, 0, 0) in reality I see white 
background.

I think Julio's right by saying that not defined explicitly background 
for body is an issue and that is something I will raise in the ASLint.

Also https://www.w3.org/TR/WCAG20-TECHS/F24.html

> Note also that this approach does not handle background images, and requires
> additional work for non-rectangular shapes (e.g. round borders).

If background-image is defined then calculating contrast ratio is 
impossible.

-- 
Cezary Tomczyk
http://www.ctomczyk.pl/

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-08-21 19:40 +0200
  Re: Finding a real background color of an element "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2018-08-21 21:14 -0700
  Re: Finding a real background color of an element JJ <jj4public@vfemail.net> - 2018-08-22 14:32 +0700
    Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-08-22 19:01 +0200
      Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-08-22 11:37 -0700
        Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-08-23 07:52 +0200
          Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-08-23 04:54 -0700
            Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-08-24 19:09 +0200
              Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-03 03:55 -0700
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-03 04:28 -0700
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-03 05:09 -0700
          Re: Finding a real background color of an element "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2018-09-02 12:40 -0700
            Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-03 03:51 -0700
              Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-03 03:55 -0700
            Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-09-04 18:52 +0200
  Re: Finding a real background color of an element Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2018-08-29 22:12 +0200
    Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-08-31 22:30 +0200
      Re: Finding a real background color of an element Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2018-09-02 05:09 +0200
        Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-09-02 19:57 +0200
          Re: Finding a real background color of an element Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2018-09-03 15:09 +0200
            Re: Finding a real background color of an element Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2018-09-04 19:02 +0200
              Re: Finding a real background color of an element Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2018-09-04 22:15 +0200
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-04 22:48 -0700
                Re: Finding a real background color of an element Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2018-09-08 15:39 +0200
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-08 06:57 -0700
                Re: Finding a real background color of an element Richard Damon <Richard@Damon-Family.org> - 2018-09-08 13:32 -0400
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-08 10:43 -0700
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-08 10:44 -0700
                Re: Finding a real background color of an element Richard Damon <Richard@Damon-Family.org> - 2018-09-08 14:23 -0400
                Re: Finding a real background color of an element Julio Di Egidio <julio@diegidio.name> - 2018-09-08 11:31 -0700
                Re: Finding a real background color of an element Richard Damon <Richard@Damon-Family.org> - 2018-09-08 17:59 -0400
  Re: Finding a real background color of an element Silvio <silvio@internet.com> - 2018-09-04 22:05 +0200

csiph-web