Можно ли эмулировать подсветку поиска Mac Osx Finder в HTML + CSS?

Question

Mac OSX Finder имеет функцию поиска, которая затемняет все, кроме соответствующей части.

_{(источник: justaddwater.dk )}

Есть ли способ эмулировать это через CSS? Я думал о добавлении полупрозрачного черного div с непрозрачностью 50. Но как тогда я могу вырезать дыру в нем ?? и возможно сделать край размытым?

Есть предложения?

Answer 1

Проверьте плагин Expose jquery из коллекции jQuery TOOLS . Я думаю, что это будет именно то, что вы ищете. У них даже есть демоверсия , стилизирующая маску с фоновым изображением .

Answer 2

возможно изображение PNG будет работать, квадрат с отверстием

Answer 3

Из-за неправильной формы вы, вероятно, ищете изображение. А из-за необходимости варьировать уровни прозрачности, вы, вероятно, хотите .png, который просто застрял бы над выбранным элементом.

Хороший вопрос, одним из способов было бы иметь «выбранный» png, в котором светящийся кружок покрывал выбранный, а другой просто темный png покрывал все остальное.

РЕДАКТИРОВАТЬ: Но вы, вероятно, захотите использовать библиотеку, такую ​​как jquery, вместо того, чтобы кодировать все, начиная с самого себя, чтобы не изобретать велосипед и не экономить МНОГО времени: D