W3C home > Mailing lists > Public > www-style@w3.org > October 2011

RE: [css3-images] simplifying radial gradients - Spotlight example

From: Brian Manthos <brianman@microsoft.com>
Date: Sun, 9 Oct 2011 06:09:29 +0000
To: Brad Kemper <brad.kemper@gmail.com>
CC: Sylvain Galineau <sylvaing@microsoft.com>, Alan Gresley <alan@css-class.com>, Chris Lilley <chris@w3.org>, "www-style@w3.org" <www-style@w3.org>
Message-ID: <9710FCC2E88860489239BE0308AC5D17F00A3A@TK5EX14MBXC266.redmond.corp.microsoft.com>
I made the page.  My desired approach was to change the gradient with background-image alone, not by fiddling with other properties.  So, no, it wasn't in my desired approach when writing the page.  Sorry, you can't read my mind as well as you might think you can.

-Brian

> -----Original Message-----
> From: Brad Kemper [mailto:brad.kemper@gmail.com]
> Sent: Saturday, October 08, 2011 10:53 PM
> To: Brian Manthos
> Cc: Sylvain Galineau; Alan Gresley; Chris Lilley; www-style@w3.org
> Subject: Re: [css3-images] simplifying radial gradients - Spotlight
> example
> 
> Yes it is.
> 
> 
> 
> On Oct 8, 2011, at 10:22 PM, Brian Manthos <brianman@microsoft.com>
> wrote:
> 
> > Again, this leverages background-position which is again not part of
> the desired approach.
> >
> > -Brian
> >
> >> -----Original Message-----
> >> From: Brad Kemper [mailto:brad.kemper@gmail.com]
> >> Sent: Saturday, October 08, 2011 3:37 PM
> >> To: Brian Manthos
> >> Cc: Sylvain Galineau; Alan Gresley; Chris Lilley; www-style@w3.org
> >> Subject: Re: [css3-images] simplifying radial gradients - Spotlight
> >> example
> >>
> >>
> >> On Oct 7, 2011, at 12:19 PM, Brian Manthos wrote:
> >>
> >>> Here's a relatively simple example of the kinds of things I expect
> >> people to want to use gradients for in the next year or two.  Most
> of
> >> the complexity is due to browser differences such as rules vs.
> cssRules
> >> and the prefixing of gradients.
> >>>
> >>> Ignore the logic related to scenery.  That's just a random backdrop
> I
> >> cobbled together to have a visual behind the effect.
> >>>
> >>> The key function to look at it BuildSpotlight.  Notice that the
> >> responsiveness to mouse location only requires updating background
> >> image, and only to specify the center of the circle.  No color stops
> >> need to be adjusted.  No other CSS properties need to be nudged.
> >>>
> >>> Notes:
> >>> (1) I've only (briefly) played with this in FF7 and IE10.  Based on
> >> my other sample pages, I expect it works in Chrome and Safari (but I
> >> suspect not in Opera).
> >>> (2) On my machine it's a bit CPU-intensive in FF7 (even with "Use
> >> hardware acceleration when available").  I don't know why and it
> wasn't
> >> intentional.  If there's a simple workaround, private e-mail would
> be
> >> appreciated.
> >>
> >> Here is a modified version that is compatible with my simplified
> >> syntax.
> >
> >
Received on Sunday, 9 October 2011 06:10:45 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:45 GMT