Flash-objektin vaihtoehtoinen upotustapa

Johdanto

Tällä sivulla käsitellään staattisella kuvalla varmistettua vaihtoehtoista Flash-objektin upotustapaa. Menetelmä soveltuu tilanteisiin, jossa normaali OBJECT-elementin käyttö ei ole mahdollista tai tarkoituksenmukaista, esimerkiksi silloin kun:

• objektin toteutustapa estää normaalin upotustavan
• objektitiedon virtaus (streaming) on tärkeää
• tahdotaan kehottaa käyttäjää hankkimaan tai päivittämään Flash-palikka

Laatuvaatimukset

Pyrkimyksenä on mahdollisimman kattava ja esteetön toteutus, jonka pitäisi toimia joka tilanteessa, riippumatta selaimesta tai sen asetuksista. Lisäksi koodin tulee olla muodollisesti validia.

Logiikka

Flash-objektin vaihtoehtoinen upotustapa noudattaa seuraavaa logiikkaa:

1. Tarjotaan objektia Active-X-komponenttina. Käytännössä Windows alustalla Internet Explorerille ja Operalle. Siirrytään seuraavaan kohtaan mikäli Active-X ei kelpaa.
2. JavaScriptillä tunnistetaan Gekko-selaimet, joille annetaan niiden tarvitsemat tiedot EMBED-laajennuksella, joka kirjoitetaan JavaScriptillä ja vain tarvittaessa. Käytännössä kaikki Mozilla-koodiin perustuvat selaimet, joissa on JavaScript-tuki päällä. Siirrytään seuraavaan kohtaan mikäli ei vieläkään tärppää.
3. Muille JavaScript-kykyisille selaimille annetaan staattinen kuva, joka kirjoitetaan JavaScriptillä ja vain tarvittaessa. Käytännössä vanhoille Netscapeille ja mahdollisesti tuntemattomille JavaScript-kykyisille selaimille. Siirrytään lopulliseen varmistukseen mikäli ei vieläkään kelpaa.
4. Tarjotaan staattinen tekstivaihtoehdolla varustettu kuva. Käytännössä kaikille oikein toimiville selaimille, jotka eivät ole tarttuneet mihinkään edellä mainittuun.

Koodi

<!--Tarjotaan objektia Active-X-komponenttina:-->
<object
 classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
 codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0"
 width="300"
 height="100">
<param
 name="movie"
 value="wp.swf?slogan_orange=XHTML CSS 
 JavaScript&amp;title_yellow=Weppipakki&amp;url=http://weppipakki.com" />

<!--Tarjotaan objektia EMBED-laajennuksena:-->
<script type="text/javascript">
//<![CDATA[

//Tunnistetaan Gekko-selaimet:
if (navigator.product == 'Gecko') {

/*
EMBED-laajennus:

<embed src="wp.swf?slogan_orange=XHTML CSS
JavaScript&amp;title_yellow=Weppipakki&amp;url=http://weppipakki.com"
width="300" height="100" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer"
type="application/x-shockwave-flash" />

kirjoitetaan write-metodilla. Kannattanee
käyttää HTML2JS-generaattoria:
http://weppipakki.com/js/dynamo/html2js.htm
*/

document.write('<embed src="wp.swf?slogan_orange=XHT'
+'ML CSS JavaScript&amp;title_yellow=Weppipakki&amp;'
+'url=http://weppipakki.com" width="300" height="100'
+'" quality="high" pluginspage="http://www.macromedi'
+'a.com/go/getflashplayer" type="application/x-shock'
+'wave-flash" />');
}

//Muille JS-kykyisille kirjoitetaan kuvalinkki:

else {
document.write('<div><a href="http://weppipakki.com"'
+'><img src="wp.png" alt="Weppipakki: XHTML-, CSS- j'
+'a JavaScript-resursseja" /></a></div>');
}
//]]>
</script>

<!--
Lopullinen varmistus sijoitetaan NOSCRIPT-lohkoon,
niille jotka eivät ole tarttuneet aikaisempiin määrityksiin:
-->

<noscript>
<div>
<a
 href="http://weppipakki.com">
<img
 src="wp.png"
 alt="Weppipakki: XHTML-, CSS- ja JavaScript-resursseja" />
</a>
</div>
</noscript>
</object>

Koodin tulos

Odotettu lopputulos?

Toteutusta voidaan pitää onnistuneena mikäli asiakas saa:

• jonkunlaisen objektia koskevan kehotuksen tai varoituksen (selain on tunnistanut objektin mutta ei esitä sitä ilman käyttäjän toimenpiteitä), tai
• näkyviin animoidun Flash-objektin (selain on tunnistanut objektin ja esittää sen suoraan), tai
• näkyviin varmistussisällön (linkin Weppipakin pääsivulle staattisena kuvana tai sen vaihtoehtotekstinä)

Menetelmän on ilmoitettu epäonnistuneen (tyhjä tulostusalue) jo vanhentuneessa Opera 7.11 -versioissa ilman Flash-tukea.