W3C home > Mailing lists > Public > www-style@w3.org > June 2013

Re: [mediaqueries] User-defined Media Queries?

From: Simon Sapin <simon.sapin@exyr.org>
Date: Sun, 02 Jun 2013 14:24:41 +0900
Message-ID: <51AAD719.2000603@exyr.org>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
CC: www-style list <www-style@w3.org>
Le 01/06/2013 03:07, Tab Atkins Jr. a écrit :
> Recently there was a thread about reducing the duplication in Media
> Queries, which wanted to use Variables.  I pointed out that we
> couldn't use CSS Variables as written, but I'd like to pursue lexical
> variables at some point in the future for this kind of thing.
> Alex Russell just suggested another approach to me in a private email
> - crack open MQs themselves and let authors plug into that
> infrastructure.  Example syntax:
>> <html>
>>    <script>
>>      if (window.outerWidth >= 600)
>>        document.css.properties["inventedConditional"] = true;
>>      }
>>    </script>
>>    <style>
>>      @media (property("inventedConditional")) {
>>        .facet_sidebar {
>>          display: none;
>>        }
>>      }
>>    </style>
>> </html>


I like the idea of custom MQs, but the downside of this approach is that 
it is not declarative. The example above is very misleading: unlike 
existing MQs, this one is not updated when the size of the viewport 
changes. The JS code would need to be inside some event handler.

So this approach has the same kind of performance issues than JS 
animations vs. CSS Animations. When this is just a shorter and DRY way 
to write a condition that can be expressed with existing MQs, the perf 
cost could be greater than the maintenance cost of repetition.

I think it is worthwhile to have both custom MQs like this (that 
probably can’t be made declarative without loosing expressive power) and 
parse-time declarative "macros" for MQs to avoid repeating complex 

Simon Sapin
Received on Sunday, 2 June 2013 05:25:11 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:30 UTC