Bug 44181 - Glass effects: Blurring elements below a given element
Summary: Glass effects: Blurring elements below a given element
Status: RESOLVED DUPLICATE of bug 68469
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Dean Jackson
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2010-08-18 09:04 PDT by Ben Lowery
Modified: 2011-09-22 13:16 PDT (History)
3 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Ben Lowery 2010-08-18 09:04:50 PDT 
RGBA background colors are wonderful for creating a variety of effects, but I often wish I could apply a blur to an element in the stack, fuzzing out the elements below. This would be very similar to the glass effect on Windows Vista, or the "blur background" effect in iTerm on the Mac.

I suggest adding a new rule to support this:

#someDiv { 
  opacity-blur: <blur radius>;
}
Comment 1 Dean Jackson 2011-04-17 15:25:07 PDT 
You can theoretically do with with SVG(XML) filters. Get the background image, apply a blur filter, then composite it before the source graphic. I have not examined to see if this actually works in webkit at the moment.
Comment 2 Dean Jackson 2011-09-22 13:16:02 PDT 

*** This bug has been marked as a duplicate of bug 68469 ***