HTML5 audio-tag forårsager fejl i JavaScript

Tags:    html5 javascript preload

<< < 123 > >>
Jeg har (fået) udviklet nogle nye elementer (scripts) til min hjemmeside, men jeg oplever problemer med et af dem. Elementerne er sat op til testing her:
http://www.grubbe.nu/scripts/

Problemet:
I midten (som nr. 4) har jeg en JavaScript 'niveau-vælger'. Den grå bar (der kører frem og tilbage mellem valgene) i niveauvælgeren loader langsomt (komme frem nogle sekunder efter siden er loadet) i nogle browsere, bl.a. Safari og Chrome.

Der gives en flaske vin til den, der kommer med løsningen :-)




Indlæg senest redigeret d. 24.07.2012 11:53 af Bruger #14061
27 svar postet i denne tråd vises herunder
0 indlæg har modtaget i alt 0 karma
Sorter efter stemmer Sorter efter dato
preload har 3 tilstande som hver gør at din lydafspiller gør forskellige ting - se nedenfor:
SYNTAKS:
<audio preload="auto|metadata|none">

auto : Browseren loader hele din lydfil så snart siden indlæses
metadata : Browseren indlæser meta-data så snart siden indlæses
none : Browseren indlæser ikke din lydfil når siden indlæses

Dette vil sige at dit musik i tilstanden 'none' først begynder at indlæses når brugeren gør noget, hvor ved 'auto' ligger det hele klar til når brugeren vil høre det.



Kunne det være denne her i din funktion.js?

Fold kodeboks ind/udJScript kode 


Prøv at fjerne det og se om det har nogen betydning, har ikke selv testet onhashchange :)

Edit: Du skal selvfølgelig stadig køre dit ol script, så lad denne stå window.setInterval(ol, 100);



Indlæg senest redigeret d. 23.07.2012 11:41 af Bruger #16319
Mange tak for svaret. Du misforstår mig dog lidt. Problemet er ikke lydafspilleren i sig selv, problemet er at koden preload='none' i lydafspiller HTML5 scriptet får et javascript på siden - et javascript til en 'niveau-vælger' (under overskrift nr. 4) - til at loade langsomt, sådan at den grå bar i niveau-vælgeren (der kører frem og tilbage mellem valgene) først kommer frem efter 4 sekunder og ikke med det samme.

@Rasmus
Det løste problemet, men desværre opstår der et andet og meget større problem, hvis jeg fjerner alt det nævnte og lader window.setInterval(ol, 100); stå i toppen; så kommer der 2-4 udgaver af den grå bar frem forskellige steder i hver niveauvælger. Så ja, ikke nogen optimal løsning :-)



Indlæg senest redigeret d. 23.07.2012 11:55 af Bruger #14061
prøv at ændre den til window.setTimeout(ol, 100);
istedet for setInterval.

setInterval kører den angivede funktion hvert angivet interval.
setTimeout kører kun den angivede funktion 1 gang efter det angivede tidsrum.



Indlæg senest redigeret d. 23.07.2012 12:33 af Bruger #16319
Tak - det ser ud til at virke.
Vil du teste om det også virker hos dig: www.grubbe.nu/scripts

Men det er nu ikke så betryggende, at man bare kan fjerne 5 linjer kode, uden at det har indflydelse på funktionaliteten.

Og så det med vinen: hvis du giver mig dit kontonummer (mail: lasse@grubbe.nu) overfører jeg 150,- for ulejligheden. Så må du selv købe den :-)
Alternativt - måske mest relevant hvis du vil have fremhævet eget firma (hvis du har sådan et) - laver jeg en 'Tak til' side, når den nye hjemmeside (www.musikipedia.dk) går i luften. Her kan jeg placere dit navn samt link til firma. Siden har knap 1000 besøg om dagen.




Det er langsomt i Chrome og Safari.



Åh nej, det kan jeg da godt se. Så må vinen desværre vente lidt, til der er fundet en ordentlig løsning :-)
Nogle forslag?



Indlæg senest redigeret d. 23.07.2012 18:42 af Bruger #14061
Åh nej, det kan jeg da godt se. Så må vinen desværre vente lidt, til der er fundet en ordentlig løsning :-)
Nogle forslag?


Jeg var desværre ikke lige online mere i går til at teste.
Når jeg kigger på siden nu har du stadig de linjer kode stående, så kan ikke rigtig debugge på det.

onhashchange er iøvrigt en ret besynderlig funktion at benytte i sådanne scripts synes jeg. Du skal ikke være bange for at fjerne den, det er ikke en funktion god crossbrowser-kode bør indeholde.
Jeg kan heller ikke se hvordan onhashchange eventet bliver kaldet når der intet hash-tegn står i URL'en på din side. Der må være noget der trigger den et sted i et af de mange scripts du har lagt ind.

Kan du prøve at fjerne det igen fra din live side så jeg kan teste?



Tak. Jeg har lavet tre testere:

Normal
http://www.grubbe.nu/scripts/index.html

window.setInterval(ol, 100);
http://www.grubbe.nu/scripts/index1.html

window.setTimeout(ol, 100);
http://www.grubbe.nu/scripts/index2.html



http://www.grubbe.nu/scripts/index2.html prøv at fjerne linjen window.setTimeout(ol, 100) igen.

setTimout kalder funktionen ol efter 100ms når siden er loadet.
Det er jo fint nok for den funktion initialiserer dine vælgere(lavalamp).
Problemet er at ol også bliver kaldet fra jquery.zoomer.1.0.js på linje 129.

Så dine vælgere bliver initialiseret 2 gange når siden er loadet.
Du kan prøve at fjerne window.setTimeout(ol, 100) som jeg skrev og så se om det ikke fikser problemet :)



<< < 123 > >>
t