Est-il possible d'émuler Mac OS X Finder point fort de recherche en HTML + CSS?

Question

Mac OS X Finder a une fonction de recherche qui obscurcit tout, mais la partie qui correspond.

_{(source: justaddwater.dk )}

Yat-il un moyen d'émuler via CSS? Je pensais à l'ajout d'un div noir semi-transparent avec une opacité 50. Mais comment puis-je couper un trou ?? et peut-être faire le bord flou?

Toutes les suggestions?

Answer 1

Consultez la Expose plugin jquery du noreferrer OUTILS jQuery collection. Je pense qu'il accomplira exactement ce que vous recherchez. Ils ont même une démo de coiffant le masque avec une image d'arrière-plan .

Answer 2

En raison des formes irrégulières, vous cherchez probablement pour une image. Et en raison de la nécessité de faire varier les niveaux de transparence, vous voulez probablement une .png qui serait juste être coincé sur l'élément sélectionné.

Bonne question, d'une façon serait d'avoir un « sélectionné » .png qui avait le cercle lumineux couvrir le sélectionné, et un couvre différents .png tout noir tout le reste.

EDIT: Mais vous voudrez probablement utiliser une bibliothèque comme jquery plutôt que de coder tout de scrath votre auto, de ne pas réinventer la roue et économiser du temps TONNES: D

Answer 3

peut-être une image PNG fonctionne, un carré avec trou