Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > эффект смены картинок в разных браузерах

Автор: CrotBuddhist 14.4.2007, 12:49

Есть ли возможность прикрутить в FireFox и Opera эффект смены картинок.

Это прекрасно работает в IE  :

            var playbackingImage = document.getElementById('playbackingImage');
            playbackingImage.style.filter ='blendTrans(duration=2)';
            playbackingImage.filters[0].apply();   //Apply the transition effect
            playbackingImage.filters[0].play();    //Play the effect and display the new image
            playbackingImage.src =  path;

Но не работает в   FireFox и Opera. (аттрибут фильтр насколько я понял в их модели отсутствует или они его не понимают)

Есть ли для них хоть какая-то альтернатива для этих браузеров ?
Буду благодарен за любые советы.

------------
P.S.
Для IE существует много красивых эффектов:

progid:DXImageTransform.Microsoft.RandomDissolve();
progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=20, Duration=2, Enabled=false)";
progid:DXImageTransform.Microsoft.RadialWipe(wipeStyle='clock')";
progid:DXImageTransform.Microsoft.Wheel(spokes=4)";
progid:DXImageTransform.Microsoft.Stretch(stretchStyle='spin')";
progid:DXImageTransform.Microsoft.Stretch(stretchStyle='push')";

Автор: skyboy 14.4.2007, 13:41

насколько мне известно, фильтры реализованы только в MS IE. Так что, если эффекты необходимы, а траффик тебе не считать, генерируй эффект перехода на сервере smile

на случай, если браузер - не IE.

Автор: SelenIT 14.4.2007, 13:59

Цитата(skyboy @ 14.4.2007, 13:41

)

генерируй эффект перехода на сервере

...это как?

В принципе, есть кроссбраузерный вариант, позволяющий делать любые переходы между картинками (даже те, что не снились MS-овским фильрам) - использовать Flash. Возможно, что-то полезное найдется в SVG/Canvas (сам с этим не работал, но вроде возможности там огромные, вплоть до 3D - где-то в прикрепленных темах есть ссылка на демо).

Ну и как минимум, FF и Opera 9 поддерживают "родную" прозрачность в CSS, в т.ч. её динамическое изменение, позволяющее создавать эффект "плавного проявления" одной картинки сквозь другую. Примеры на форуме, по-моему, тоже были...

Автор: butionok 14.4.2007, 15:01

Лучше DX фильтров IE пока ничего не придумали. Я имею ввиду соотношение (затраченные усилия)/(эффект). Для того чтобы они работали не нужно знать никаких дополнительных средств программирования. Несколько строчек и всё работает. И пользователю не нужно устанавливать никакие Флэши... И грузят проц эти фильтры по минимуму.

Цитата

FF и Opera 9 поддерживают "родную" прозрачность в CSS, в т.ч. её динамическое изменение, позволяющее создавать эффект "плавного проявления" одной картинки сквозь другую.

Во первых это больше грузит проц. Потом приходится выбирать: либо очень долгий переход, но плавный, либо быстрый, но дёрганный. Опера вообще тормозная в смысле графики. Достаточно посмотреть как работает Lightbox в Опере. Там от эффекта перехода ничего не осталось. Противно смотреть.

Автор: CrotBuddhist 14.4.2007, 16:48

Cпасибо всем за советы.
Пока оставлю эффекты только в IE.

Но познакомится с Canvas и SVG не помешает.

http://ru.wikipedia.org/wiki/SVG
http://en.wikipedia.org/wiki/Canvas_(HTML_element)

Автор: GogA 23.4.2007, 12:11

сорри, твой скрипт не тестю, у меня в фф и осле работает плавная смена картинок...
http://s.gogolev.net/

можно сделать и плавное изменение картинка1 - картинка2, а не картинка2 - фон - картинка2... smile

в последнем случае в качестве фона должна использоваться вторая картинка.. визуально будет как картинка1 - картинка2

сорри если не то smile