Opdater statusbar på mouseOver - ligesom almindelige links

Optimal brugervenlighed er som oftest lig med er ensbetydende med, at brugeren skal kunne forudsige hvad der sker, når der for eksempel trykkes på et link.

Ved almindelige html-links opdaterer browseren automatisk statusbaren (den lille grå bjælke for neden) til at vise url’en for der hvor man er på vej hen, når man holder musen over det.

Holder du derimod musen over en knap i Flash med en getURL kommando, så sker der ingenting, men det er der en løsning på.

Step 1 - Javascript funktion
Flash har ikke som udgangspunkt adgang til at opdatere browserens statusbar, men det kan man via javascript, så første step er at lave en funktion til det:

function changeStatus(newStatus) {
window.status = newStatus;
}

Step 2 - Actionscript funktion
For ikke at gentage den samme kode mange gange er næste skridt at lave en funktion i ActionScript der kalder javascript funktionen fra før:

function changeStatus(newStatus:String):Void {
getURL("javascript:changeStatus('" + newStatus + "')");
}

Step 3 - Knap kode
Hvordan man vælger at bygge det op herfra kan gøres på mange måder, men for igen at undgå at gentage for meget kode, har jeg lavet en funktion til at initiere en knap som gør følgende:
- Sætter en url
- Tilføjer et kald med den url til changeStatus på rollOver
- Tilføjer et kald med en blank værdi til changeStatus på rollOut

Det er kommet til at se sådan ud:

function initiateButton(curBtn:Button, strURL:String):Void {
eval(String(curBtn)).gotoURL = strURL;
curBtn.onRollOver = function() {
changeStatus(this.gotoURL);
}
curBtn.onRollOut = function() {
changeStatus("");
}
}

For at initiere en knap kaldes den på denne måde:

initiateButton(Btn1,"http://www.jubii.dk");
initiateButton(Btn2,"http://www.omflash.dk");

Step 4 - Slut, prut, finale
For at det virker skal javascript funktionen være placeret på samme html-side som viser swf’en, men så burde det også virke.

Eksempel

Note: Firefox er væsentlig mere restriktiv hvad angår javascript end Internet Explorer, så her kan man som standard ikke tilgå window.status. For at slå det til skal du gå ind i Tools –> Options –> Web features –> Klikke på knappen “Advanced” til højre for “Enable JavaScript” –> Sætte et flueben ud for “change status bar text”.

Koden er først og fremmest lavet som proof-of-concept, så jeg har ikke testet den på tværs af alle Flash Player versioner, browsere, operativsystemer m.m.



Del:These icons link to social bookmarking sites where readers can share and discover new web pages.
  • del.icio.us
  • digg

Skriv en kommentar