JS / JQuery Эффекты перехода изображения - жалюзи?

Question

Я бы хотел эффект перехода между 2 или более изображениями. Я знаю, что простые переходы могут быть легко выполнены в JQuery, особенно с плагином Cycle , но я хочу что-то более сложное. Вот так , хотя это плохой пример. Эффект стиля «жалюзи», при котором вы можете видеть одно изображение через другое по мере его изменения. Я надеюсь, что я чист.

Я действительно хотел бы, если возможно, избегать использования Flash.

---

Я уже использовал animate несколько раз. То, что я хочу, - это способ реализовать стиль перехода, с которым я связан, либо готовый, либо с небольшой помощью. Моя проблема в том, что изображение по существу разделено, а не просто перемещено. Может быть, есть способ использовать маски?

Answer 1

Диагональные жалюзи будут практически невозможны только с помощью javascript. Я могу придумать несколько способов сделать это с файлами изображений, но это будет святой взлом, и анимация вряд ли будет плавной. Вероятно, есть способы сделать это с помощью canvas, но это также будет головной болью, потому что вы должны использовать canvas-> vml, чтобы он работал с IE.

Если у вас все в порядке с горизонтальными / вертикальными жалюзи, просто добавьте несколько div-ов и анимируйте ширину / высоту.

Answer 2

Если у вас все в порядке с опцией вертикальных жалюзи, теперь есть очень удобный плагин jQuery, который даст нужный эффект: http://nivo.dev7studios.com