Каков наилучший способ встраивания файлов Flash (swf) в документы HTML (и XHTML)? - PullRequest
11 голосов
/ 07 июля 2010

Как и большинство людей, я использую SWFObject для встраивания файлов Flash (swf) в мои веб-проекты.

Как вы знаете SWFObject предлагает 2 способа встраивания Flash : статическая публикация и динамическая публикация.

Статическая публикация использует обычную разметку для встраивания файла в документ, а также выполняет проверки с помощью JavaScript, которые нельзя выполнить с помощью обычной разметки. Это хорошо, если у вас есть клиенты, которые не могут включить JavaScript (поисковые системы, некоторые портативные устройства ...), файл все равно будет отображаться (если у них установлен правильный плагин Flash). Но если у вас есть люди в устаревшем / не исправленном Internet Explorer ( в период с апреля 2006 г. по апрель 2008 г. ), у них будет страшный «щелчок для активации» для взаимодействия с Flash.

Динамическая публикация использует JavaScript для встраивания Flash. Это избавит от функции «нажмите, чтобы активировать» в старом IE, но если JavaScript отключен, Flash вообще не будет там.

Оба метода имеют свои преимущества и недостатки. В утопическом мире мы все использовали бы метод динамической публикации, но мы (или, по крайней мере, некоторые из нас, такие как я) застряли с клиентами, использующими действительно старые системы с IE 6 (они хотели бы обновить, но не могут из-за плохой работы). разработанное программное обеспечение, которое стоило бы 10K + $ для обновления). Мне нужна поддержка устаревшего IE и я хочу избавиться от функции «нажмите, чтобы активировать», поддерживая людей с отключенным JavaScript.

Как насчет сочетания статических и методов динамической публикации? Как насчет чего-то вроде:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title>SWFObject 2 static+dynamic publishing example page</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript">
        swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf");
        </script>
    </head>
    <body>
        <div id="myContent">
            <object id="myId" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="300" height="120">
                <param name="movie" value="test.swf" />
                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="test.swf" width="300" height="120">
                <!--<![endif]-->
                <div>
                    <h1>Alternative content</h1>
                    <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
                </div>
                <!--[if !IE]>-->
                </object>
                <!--<![endif]-->
            </object>
        </div>
    </body>
</html>

Я показал это интегратору, и он сказал мне, что я должен использовать теги <object> и <embed> ...

Каким будет наилучший способ встраивания Flash в веб-проекты? Решение, которое:

  • Будет работать с отключенным JavaScript (Flash встроен в альтернативный контент)
  • Пройдет валидатор W3C
  • Удалит «клик для активации» в устаревшем / не исправленном IE
  • Будет использовать Flash-обнаружение / автоматическую установку SWFObject

РЕДАКТИРОВАТЬ: Добавлена ​​награда. Пожалуйста, я не хочу видеть ответы типа "не беспокойтесь, чтобы ни у кого не было JavaScript в наши дни" или "если javascript выключен, скорее всего, Flash тоже будет отключен".


РЕДАКТИРОВАТЬ 2: Ответ, который я ищу, - лучший способ встроить Flash статически (с обычными тегами HTML). За это я добавлю динамическую публикацию. Что-то , подобное этому , которое будет работать во всех основных браузерах начиная с IE 6 и которое пройдет проверку W3C.


Ответы [ 7 ]

4 голосов
/ 15 июля 2010
<head>
    <script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
    <script>
    var flashVars = {};
    var params = {};
        params.allowScriptAccess = "always";
        params.allowFullScreen = false;
        params.bgcolor = "#1a1a1a";
        params.wmode = "opaque";

        var atts = {};
        atts.id = "my-swf";

    swfobject.embedSWF("my.swf", "my-swfobject", "100%", "100%", "10.1.0", "playerProductInstall.swf", flashVars, params, atts);
    </script>
</head>
<body>
    <div id="my-swfobject">
        <!-- Any <object></object>, <embed></embed>, and everything else here will be rendered for users without JavaScript. If JavaScript is on, SWFObject will destroy div#my-swfobject and replace it with object#my-swf. -->
    </div>
</body>

Дайте мне знать, если это то, что вы ищете. Я могу уточнить больше, если это необходимо. Вы также можете подумать о том, чтобы ваши ведомые IE6 установили Google Chrome Frame: http://code.google.com/chrome/chromeframe/

2 голосов
/ 05 августа 2010

Вот оно:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
    <head>
        <title></title>
        <script type="text/javascript" src="swfobject.js"> </script>
        <script type="text/javascript">
            swfobject.embedSWF('test.swf', 'myFlash', '320', '240', '9.0.0', '/swfobject/expressInstall.swf', 0, 0, 0);
        </script>
    </head>
    <body>
        <div>
            <object id="myFlash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="320" height="240">
                <param name="movie" value="test.swf">
                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="test.swf" width="320" height="240">
                <!--<![endif]-->
                    <p>Version ???</p>
                <!--[if !IE]>-->
                </object>
                <!--<![endif]-->
            </object>
        </div>
    </body>
</html>
1 голос
/ 09 июля 2010

То, что я сделал в прошлом, статически помещает мой flash-контент в div (используя теги object и embed), а затем SWFObject перезаписывает содержимое этого div при загрузке.Это будет как можно ближе к тому, что вы хотите сделать.

0 голосов
/ 16 июля 2010

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>test</title>
</head>
<body>
    <p>
        <object width="160" height="112" data="movie.swf" type="application/x-shockwave-flash">
            <param name="movie" value="movie.swf" />
        </object>
    </p>
</body>
</html>

Нет лучшего варианта, я думаюэто будет работать в браузерах IE, Mozilla и Webkit и является действительным в формате xhtml.но нет флеш-установщика и нет замены.

0 голосов
/ 15 июля 2010

Я бы взял пример с таких сайтов, как YouTube, которые позволяют встраивать Flash. Не уверен, что это будет работать для не типа "кино".

с YouTube:

<object width="[width]" height="[height]">
<param name="movie" value="[Path to SWF]"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="[Path to SWF]" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="[width]" height="[height]"></embed>
</object>
0 голосов
/ 15 июля 2010

Есть ли способ заставить ваших клиентов установить другой браузер (например, Firefox) наряду со старым и использовать IE6 для старого приложения и FF для вашего?

0 голосов
/ 07 июля 2010

Перейти с динамической публикации.Если у пользователя отключен JavaScript, откажитесь.Они также не захотят запускать Flash.

...