Is it possible to emulate the Mac Osx Finder search in HTML + CSS?
The Mac OSX Finder has a search feature that dims everything except the part that matches.
Is there a way to mimic it using CSS? I was thinking about adding a semi-transparent black div with an opacity of 50. But how then do I cut the hole? and maybe make the border fuzzy?
Any suggestions?
source to share
Have a look at the Expose jquery plugin from jQuery TOOLS . I think it will do exactly what you are looking for. They even have a mask style demo with a background image .
source to share
Due to the irregular shape, you are probably looking for an image. And due to the need for different levels of transparency, you probably want a .png that just stuck over the selected element.
Good question, one way would be to have a "selected" png with a glowing circle covering the selected one and another only dark png covering everything else.
EDIT: But you probably want to use a library like jquery instead of coding everything from scratching yourself to not reinventing the wheel and saving TONS of time: D
source to share