Новости

Бесплатные флешевые ротаторы изображений

Использование флеш анимации

swfobject

Библиотека позволяет добавлять на страницу флеш объекты при помощи Javascript, при этом такой подход позволяет добиться X/HTML валидности коди при использовании флеш-роликов.

Бесплатные флешевые ротаторы изображений- JW Image Rotator

Для того чтобы получить ротатор изображений необходимо закачать на сервер flash файл, javascript библиотеку swfobject, затем

Создать XML файл содержащий ссылки на изображения, подписи и сслыки по клику:

<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
    <trackList>
        <track>
            <title>JW Image Rotator</title>
            <creator>Admin</creator>
            <location>http://kovit.co.ua/Portals/5/Rotator-2.jpg</location>
            <info>http://www.longtailvideo.com/players/jw-image-rotator/</info>
        </track>
        <track>
            <title>FLabell ROTATOR</title>
            <creator>Admin</creator>
            <location>http://kovit.co.ua/Portals/5/Rotator-1.jpg</location>
            <info>http://www.flabell.com/flash/Fade-In-Fade-Out-Slideshow-282</info>
        </track>
          
    </trackList>
</playlist>

И далее использовать следующий код HTML/javascript:

<div style="z-index: 0; width: 600px; height: 372px;" id="Rotator"><a rel="nofollow" href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this rotator.</div>
<script type="text/javascript">
                    var bW = "600"; // размеры
                    var bH = "372";
                    var swfRotator = new SWFObject(PathtoFlash + "JWImageRotator.swf","rotator",bW,bH,"7"); // добавление параметров
                    swfRotator.addParam("allowfullscreen","false");
                    swfRotator.addParam("wmode","transparent"); // делает флеш не перекрывающим html
                    swfRotator.addVariable("file",PathToXMLFile + "Rotator.xml"); // файл с картинками
                    swfRotator.addVariable("width",bW);                   
                    swfRotator.addVariable("height",bH);
                    swfRotator.write("Rotator"); // изменение HTML и создание флеш-ролика
    </script>

В результате у Вас должен получиться такой вот флешевый ротатор изображений

Get the Flash Player to see this rotator.

 

flabell

Работает по тому же принципу что и предидущий ротатор, нужен флеш файл, библиотека swfobject, и создать XML-файл:

<?xml version="1.0" encoding="UTF-8"?>
<kenburns width="600" height="372" startWith="1" backgroundColor="0xffffff" backgroundTransparency="100" randomSlideshow="true" loop="true">
    <item>
        <path>http://kovit.co.ua/Portals/5/Rotator-2.jpg</path>
        <link>http://www.longtailvideo.com/players/jw-image-rotator/</link>
        <target>_blank</target>       
        <transitionTime>1</transitionTime>
        <slideShowTime>5</slideShowTime>
    </item>   
    <item>
        <path>http://kovit.co.ua/Portals/5/Rotator-1.jpg</path>
        <link>http://www.longtailvideo.com/players/jw-image-rotator/</link>
        <target>_blank</target>
        <transitionTime>1</transitionTime>
        <slideShowTime>5</slideShowTime>
    </item>       
</kenburns>

Далее использовать следующий Javascript/HTML код:

 <div id="ourfLabelRotator" class="fLabelRotator" style="z-index: 0;"><a rel="nofollow" href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this rotator.</div>
            <script type="text/javascript">
        var cacheBuster = "?t=" + Date.parse(new Date());        
           
            // stage dimensions
            // if you define '100%' then the swf will have the browser dimensions
            var bcW = "600";//"100%";
            var bcH = "372";//"100%";


                       var swffLabelRotator = new SWFObject(PathToSwf + "FlashRotator.swf"+cacheBuster,"ourfLabelRotator", bcW, bcH,"7");
                                swffLabelRotator.addParam("bgcolor","#ffffff");
                                swffLabelRotator.addParam("wmode","transparent"); // make flash object     transparent                            
                                swffLabelRotator.addVariable("componentWidth",bcW);
                                swffLabelRotator.addVariable("componentHeight",bcH);                                
                                swffLabelRotator.addVariable("pathToFiles","");
                                swffLabelRotator.addVariable("xmlPath", PathToXML + "fLabel.xml");                                 
                                swffLabelRotator.write("ourfLabelRotator");
           
                </script>

в результате у вас должен получиться такой флешевый ротатор

Get the Flash Player to see this rotator.

Галерея

Средний рейтинг - 4.8 (12голосов)
Нажмите на звездочку для того чтоб проголосовать, ваша оценка - 1

Хотите оставить свой комментарий?

Комментарий сохраняется
Ваше имя: Введите ваше имя/ник
E-mail: некорректный e-mail

Комментарии:

Страждущий (22.06.2010): Прикольные, мне токой надо на главную

Антон (10.11.2010): СПАСИБО ЗА ПОСТ. Тем кто еще не скачал: !!! Что бы скачать, необходимо запегистрироваться !!!

Создание современных веб сайтов - по доступной цене!

Мы в Социальных Сетях