Effet de flou sur un élément div

Est-il possible d'ajouter un flou gaussien sur div élément? Si oui, comment je peux faire cela?

InformationsquelleAutor bialasikk | 2012-08-15
  1. 80

    Je pense que c'est ce que vous recherchez? Si vous êtes à la recherche d'ajouter un effet de flou à un élément div, vous pouvez le faire directement par le biais de Filtres CSS-- Voir violon: http://jsfiddle.net/ayhj9vb0/

     div {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
  width: 100px;
  height: 100px;
  background-color: #ccc;

}
    InformationsquelleAutor BenSlight
  2. 9

    Essayez d'utiliser cette bibliothèque: https://github.com/jakiestfu/Blur.js-II

    Qui devrait le faire pour toi.

    • Il a des bugs avec chrome + lent chargement de la page.
    • lien brisé. essayez de blur.js version II
    InformationsquelleAutor Phillip Schmidt
  4. -1

    J'ai eu le flou de travail avec SVG filtre de flou:

    CSS

    -webkit-filter: url(#svg-blur);
        filter: url(#svg-blur);

    SVG

    <svg id="svg-filter">
    <filter id="svg-blur">
        <feGaussianBlur in="SourceGraphic" stdDeviation="4"></feGaussianBlur>
    </filter>
</svg>

    De travail exemple:

    https://jsfiddle.net/1k5x6dgm/

    Veuillez noter que cela ne fonctionne pas dans les versions IE

    InformationsquelleAutor Rijo K P