Поиск одновременного эффекта затухания и размытия с помощью JQuery или Javascript

Question

Может кто-нибудь придумать способ имитации эффекта фейдера / размытия, используемый на следующем веб-сайте:

http://www.frenchlaundry.com/ (при наведении изображение исчезает, а при одновременном исчезновении текста)

используя JQuery? Я надеюсь, что вся эта цепочка эффектов произойдет при нагрузке или когда DOM будет готов (вместо зависания). И под размытием я подразумеваю размытие по Гауссу - возможно, используя Pixastic (?)

Я действительно новичок в этом, поэтому, пожалуйста, будьте осторожны:)

Спасибо.

Answer 1

Вы должны использовать метод animate () Jquery для достижения того, чего вы хотите.

Проверьте ссылку ниже ... Есть множество примеров:

http://api.jquery.com/animate/

НТН

Answer 2

Эта библиотека включает в себя возможность размытия изображений: http://www.pixastic.com/

Что касается анимации эффекта размытия, как сказал Раджа, вы можете посмотреть на метод animate () Jquery или просто использовать функцию setTimeout.

Answer 3

Так как эффекты Jquery являются просто реализациями метода animate (), который использует свойства CSS, а затем делает плавный переход между ними, нет простого способа реализовать размытие по Гауссу.

Вы можете использовать Pixastic, а затем добавить размытый текст поверх размытого изображения, почему бы и нет.