Предоставление альтернативных изображений, если Adobe Flash недоступен - PullRequest
Новая
       6

Предоставление альтернативных изображений, если Adobe Flash недоступен

17 голосов
/ 16 января 2009

Существуют ли какие-либо способы предоставления альтернативного изображения в формате GIF / PNG, если у пользователя не установлен и / или деактивирован Adobe Flash. Я нашел рекомендации, такие как следующие от W3C, которые определяют через JavaScript существование Adobe Flash на клиенте: W3C Предоставление альтернативных изображений

Честно говоря, я бы предпочел non JS технику. Я думаю о каком-то теге XHTML, эквивалентном <noscript>. (например, <noobject>, если объект (в нашем случае Flash) не может быть отображен / загружен).

Причина необходимости такого разделения заключается в следующем: Банк, в котором я работаю, предпочтительно будет отображать свои баннеры в формате Flash. Если это невозможно, должно быть показано простое изображение. В прошлом это было решено очень вероятно способом, упомянутым ранее. В настоящее время мы работаем над обновлением дизайна, и именно здесь я наткнулся на этот фрагмент кода, который заставляет меня задуматься, действительно ли это самый элегантный и совместимый способ сделать это.

Другая идея , которая меня поражает: возможно ли загрузить Flash-объекты в отключенной JavaScript-среде?

Ответы [ 6 ]

13 голосов
/ 16 января 2009

На самом деле установлен флеш, но javascript выключен, это допустимый сценарий. Это должно работать в большинстве браузеров: 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="flashContent">
  <param name="movie" value="flash.swf" />
  <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="flash.swf" width="800" height="600">
  <!--<![endif]-->
      <img src="(...)" alt="Put your alternate content here" />
  <!--[if !IE]>-->
    </object>
  <!--<![endif]-->
</object>
5 голосов
/ 16 января 2009

Я использую следующий код для постепенной деградации. Хорошо работает. 

<!--[if !IE]> -->
<object type="application/x-shockwave-flash" data="flash.swf" width="500" height="100">
<!-- <![endif]-->

<!--[if IE]>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
    codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" 
    width="500" height="100">
  <param name="movie" value="flash.swf" />
<!--><!--dgx-->
  <param name="loop" value="false">
  <param name="menu" value="false">
  <param name="quality" value="high">
  <img src="flash_replacement.png" width="500" height="100" alt="No Flash">
</object>
<!-- <![endif]-->
4 голосов
/ 16 января 2009

Я не знаю, почему вы хотите избежать JavaScript, это лучшее решение при работе с Flash.

с помощью библиотеки SWFObjects (самой известной на данный момент) вы можете сделать это: 

<!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"> 
<head> 
 <title> My Home Page </title> 
 <meta name="viewport" content="width=780"> 
 <script type="text/javascript" src="swfobject.js"></script> 
</head> 
<body> 
 <div id="splashintro"> 
   <a href="more.html"><img src="splash_noflash.png" /></a> 
 </div>
 <script type="text/javascript"> 
   var so = new SWFObject("csplash.swf", "my_intro", "300", "240", "8", "#338899"); 
   so.write("splashintro"); 
 </script> 
 </body> 
</html>

Сценарий заменяет splashintro div на файл флэш-памяти, если браузер не поддерживает Flash, тогда ничего не происходит и будет показан splash_noflash.png . 1012 *

P.S. С помощью этой техники вы готовы к iPhone, вместо того, чтобы показывать синий куб, он покажет изображение:)

2 голосов
/ 13 сентября 2012

Мы можем предоставить альтернативное изображение в формате GIF / PNG, если у пользователя не установлен и / или деактивирован Adobe Flash. 

<object id="flashcontent classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="550px" height="400px">
<param name="movie" value="mymovie.swf" />

<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="mymovie.swf" width="550px" height="400px">
<!--<![endif]-->

<p>
Fallback or 'alternate' content goes here.
This content will only be visible if the SWF fails to load.
</p>

<!--[if !IE]>-->
</object>
<!--<![endif]-->

</object>

А также добавить это ... 

<script type="text/javascript">
swfobject.registerObject("flashcontent", "9", "/path/to/expressinstall.swf");   
</script>
2 голосов
/ 07 сентября 2011

Я обнаружил, что для достижения цели используется встроенный стиль.

Например: 

<div style="background-image: url('...');">
    <object>
     /* Embedded Flash */
    </object>
</div>
0 голосов
/ 26 декабря 2012

Я написал простой способ сделать это в CSS - никакого дополнительного JavaScript вообще.

Назовите свой идентификатор / класс, в котором находится ваш Flash-фильм, и используйте фоновое изображение. Оберните свой Flash-фильм в этот раздел.

Например: 

<div ID="MyFlashMovie"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="flashContent">
  <param name="movie" value="flashMovie.swf" />... etc., etc.</object>
</div> etc.

Тогда в вашем CSS: 

#MyFlashMovie {
background: url("alternateGraphic.png");
background-repeat: no-repeat;
height: XXpx;
width: XXpx;
}

Если вспышка недоступна, скажем, на iphone / pad, отобразится изображение. Единственный недостаток, который я обнаружил, заключается в том, что если ваш Flash-фильм использует прозрачный фон, вы увидите альтернативную графику через переходы. Просто сделайте сплошной цвет внутри Flash-фильма в качестве самого нижнего слоя (убедитесь, что он такой же, как и на веб-сайте), и он будет хорошо выглядеть.

~ GreaseJunkie

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...