Kudos. A similar idea I had but never implemented (no doubt I'm not the only one), that would show/hide text based on user knowledge rather than screen size:

  Mar. 21, 2010
  -------------
  
  Sometimes when writing a blog post, article, or other composition that will be
  read by more than one class of audience, one audience can become bored or upset
  by content that is needed to bring another audience up to speed.  For example, a
  blog written by a highly technical person both to educate other technical people
  and to keep less-technical family members in the loop may include lots of
  simplified definitions of technical terms that most technical people already
  know.  To prevent alienation of the technical group while still preserving the
  definitions and explanations for non-technical readers, definitions could be
  surrounded by a span or div of class "nontech_definition".  A simple script,
  client-side custom stylesheet, or alternate stylesheet could then allow
  technical readers to set those definitions to visibilty:hidden or even
  display:none, and continue on their way uninterrupted by repetitive and
  unnecessary (for them) clarifications.  To alert the technical readers of this
  possibility, a note or link could be provided by the first definition on each
  page (or last, or as a footnote or tooltip, etc.) explaining how to hide the
  definitions.

This idea occurred to me while reading an article about VCs and startups. The article made repeated reference to BI businesses, but I had to look up the relevant definition of BI (in this case, business intelligence).

P.S. I'm sure my variation of the idea was anticipated by the creators of CSS.