Niels Gamborgs online notesbog

Aktiver Flash automatisk og fjern den grimme ramme omkring SWF film

marts 30th, 2007. Kategori: Flash, Webudvikling

Den grimme ramme omkring Flash

For godt og vel et års tid siden opdaterede Microsoft deres Internet Explorer, så aktivt indhold skulle aktiveres, inden man kunne bruge det. Det betyder, at man nu skal klikke på på en flash film inden den bliver aktiv.

 Det giver flere problemer. For det første er det grimt, når der på ens hjemmeside dukker en tilfældig  ramme op omkring ens SWF-fil. Endvidere oplever man, at når man klikker på SWF filen,  så sker der ingenting. Mindre erfarne brugere, der ikke umiddelbart genkender elementet som et flash objekt forledes til at tror, at objektet ikke er klikbart. 

 Det vil være ideelt at kunne lave en automatisk aktivering af flash.

Løsningen

Løsningen på dette problem er ganske enkel. Du får et simpelt JavaScript til med document.write() at skrive  de XHTML tags, som afspilningen af Flash filmen behøver. Dette JavaScript SKAL placeres externt. Og derefter hentes in i headeren på XHTML’en og funktionen kaldes nede i body’en. Og voilsa rammen er væk og flashobjektet er aktivt og klart til brug.

Det kan lyde som en større process, men er egentlig ganske let. Jeg vil forsøge at forklare det meget udførligt, så også folk uden kendskab til JavaScript programmering kan bruge denne løsning.

XHTML

Her er først et eksempel på hvordan dine tags i html dokumentet typisk ville se ud.  (nedenstående validerer forøvrigt I XHTML 1.1, hvilket også kan være problematisk)

 <object type=”application/x-shockwave-flash” data=”flash/minflashfilm.swf” width=”200px”  height=”180px” id=”flashfilm”>
    <param name=”movie” value=”flash/minflashfilm.swf” />
    <param name=”wmode” value=”transparent” />
   </object>

JavaScript

Løsningen går i al sin enkelthed ud på at du nu vil få JavaScript til at skrive de ovenstående tags. Det gør du ved at copy-paste ovenstående ind i følgende script:

function skriv_flash_tags(){      //funktionen oprettes. ændr ikke noget her
document.write(‘ dine html tags her \n’);      //indsæt  dine tags her. en linie af gangen
document.write(‘ dine html tags her \n’);      //indsæt  dine tags her. en linie af gangen
document.write(‘ dine html tags her \n’);      //indsæt  dine tags her. en linie af gangen
document.write(‘ dine html tags her \n’);      //indsæt  dine tags her. en linie af gangen
      // funktionen afsluttes her

Hvis du har flere eller færre linier i dit XHTML tilføjer eller fjerne du bare document.write linier efter behov. I mit eksempel giver det følgende script:

 function skriv_flash_tags(){
  document.write(‘
<object type=”application/x-shockwave-flash” data=”flash/minflashfilm.swf” width=”200px”  height=”180px” id=”blaster”>\n’);
  document.write(‘<param name=”movie” value=”flash/minflashfilm.swf” />\n’);
  document.write(‘<param name=”wmode” value=”transparent” />\n’);
  document.write(‘</object>\n’);
 }

 Gem så scriptet under navnet flash_aktivator.js.  I headeren på dit XHTML dokument henter du nu dit gemte JavaScript med følgende:

<script type=”text/javascript”  src=”minjvavscriptmappe/flash_aktivator.js” mce_src=”minjvavscriptmappe/flash_aktivator.js” ></script>

Og endelig skriver du følgende i nede i body’en for at kalde/starte funktionen:

 <script type=”text/javascript”>skriv_flash_tags();</script>

Eksempel

 Og så skulle du gerne være kørende. Du kan se et eksempel her på det færdige resultat her: http://nielsgamborg.dk/mix/events.php  Ghettoblasteren i det nedre højre hjørne er lavet i Flash og bliver automatisk aktiveret.

Vær opmærksom på at være vanvittig præcis med navne, tegn etc. Selv meget små fejl, vil (som altid når det gælder programmering)  medføre, at det ikke virker.

Hvis du har haft glæde af denne artikel, så smid lige en kommentar og gør også mig glad. Hvis du oplever problemer så smid også  en kommentar, så kigger vi på det.

Læs mere om Aktivering af flash på min hjemmeside Automatisk aktivering af Flash

Skriv en kommentar