Гауссовское размытие onHover Использование jQuery

Мне интересно, есть ли способ применить gaussian blur к div с помощью jQuery (или CSS, который jQuery может изменить). Я заглянул в blur (), но, по крайней мере, с Safari, похоже, что он не выполняет то, что я ищу. Если возможно, я хочу использовать fadeIn для эффекта, поэтому он постепенно размывается.

Спасибо за любую помощь!

  • MongoError: топология была разрушена sailsjs
  • Как включить все файлы JavaScript в каталог через файл JavaScript?
  • Открыть URL ссылки в новом пустом окне
  • Нужны ли фигурные скобки в однострочных операциях в JavaScript?
  • Установите значение по умолчанию для ввода пароля, чтобы его можно было прочитать
  • Показывать сообщения об ошибках проверки при отправке в angularjs
  • 4 Solutions collect form web for “Гауссовское размытие onHover Использование jQuery”

    Имейте в виду, что Blur – это когда DOM-элемент, такой как текстовые поля (входы и т. Д.), Теряет фокус и не должен смешиваться с видом размытия, о котором вы говорите (гауссовское / motion blur).

    Для этой проблемы нет хорошего кросс-браузерного решения. Вы можете, однако, размыть изображения, используя API, например, тот, который предлагает Бэн. Или с помощью этого .

    Может быть, если вы узнаете способ нарисовать ваше содержимое div на холст HTML5, вы можете применить фильтр Blur с помощью Pixastic ?

    Проверьте плагин blur.js для jQuery: http://blurjs.com , он использует мой алгоритм Stack Blur, который, по моему мнению, в настоящее время является самым быстрым на основе JavaScript способом размытия элементов холста: http://www.quasimondo.com/StackBlurForCanvas /StackBlurDemo.html

     filter: blur(10px); -webkit-filter: blur(10px); -moz-filter: blur(10px); -o-filter: blur(10px); -ms-filter: blur(10px); filter: url(blur.svg#blur); filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='10'); 

    Содержание blur.svg

     <svg version="1.1" xmlns="http://www.w3.org/2000/svg"> <filter id="blur"> <feGaussianBlur stdDeviation="10" /> </filter> </svg> 

    Подробнее: http://demosthenes.info/blog/534/Crossbrowser-Image-Blur

    Здесь не упоминалось, что мы можем создать отличный реалистичный эффект размытия для текста, используя text-shadow CSS3. И (да, конечно!), Мы можем размыть сплошные фоны и границы с помощью box-shadow (вы знаете, вставляют тени и несколько теней).

    Поэтому я надеюсь, что в большинстве случаев вы можете достичь реалистичного эффекта размытия:

    1) размытие изображения с использованием холста

    2) размытие text-shadow с использованием text-shadow

    3) сплошной фон и размытие границ с использованием box-shadow

    4) Я забыл что-нибудь еще? ….


    PS: Я считаю, что невозможно написать волшебный класс, который размывает любой html.

    Ограничения, которые невозможно преодолеть: размыть границу изображения, размыть встроенные медиа

    JavaScript делает сайт умным, красочным и простым использованием.