Browser problemer

Problemer jeg har oplevet i forskellige browsere i forbindelse med ny teknologi som HTML5

Introduktion

Da HTML5 er ny understøtter de forskellige browsere ikke alt i HTML5.
Det er altså forventeligt at der er nogle problemer.

På denne side vil jeg skrive om de problemer jeg har oplevet i de forskellige browsere.

Generelle problemer

En ting der irritere mig er at lydstyrken som standard er sat til 100 % når man laver et <audio> eller <video> tag.
Når man så afspiller så kan lyden jo være meget højt hvilket ikke er rart.
Man kan dog ændre lydstyrken med JavaScript inden lyden afspilles.

Firefox

Firefox logo
I Firefox 16.0.2 opdager jeg at nogle wav filer ikke vil afspilles selvom de har virket i tidligere versioner af Firefox.

For eksempel med konsol fejlen : Multimedieressourcen http://localhost/netkoder/lyd/yeah_virkerikke.wav kunne ikke dekodes.

Jeg er ikke sikker men det er muligvis fordi Firefox ikke vil afspille "Signed 8-bit PCM". Men gerne "Unsigned 8-bit PCM".
I Audacity kan man ikke gemme som "Signed 8-bit PCM". Derfor kan jeg ikke teste det.
Unsigned 8-bit (unsigned8bit.wav) (Virker ikke i Firefox 16.0.2 - Virkede dog i tidligere versioner - Virker i Firefox 28.0) (88 58 01 00 02 00 08 00):
Signed 16-bit (signed16bit.wav) (Virker) (10 b1 02 00 04 00 10 00):

Der er ingen pop-op-lydstyrkeregulering på <audio> når man holder markøren over højtaler ikonet så man kan ikke skrue op og ned for lyden.
I Firefox 28.0 er der kommet lydstyrkeregulering på <audio>.

Hvis man gør <audio> bredere med CSS så bliver den også højere selvom man ikke har angivet at den skal være højere.
Ser ud til at virke i Firefox 28.0.
Resultatet ovenfor er skabt af følgende kode

I Firefox 17.0.1 skjules <audio> hvis filen ikke findes eller ikke kan afspilles af browseren hvilket kan være irriterende.
Her har jeg givet afspilleren en kant så man kan se hvor den burde være.
I Firefox 28.0 vises afspilleren nogle gange og andre gange ikke.
Kunne måske være fordi jeg tidligere ikke havde angivet en src som ifølge validator.w3.org er krævet.
Resultatet ovenfor er skabt af følgende kode

Opera

Opera logo

Opera 12.00 skal have "background-color: ButtonFace;" ellers bliver knappens baggrund af en eller anden grund når man bruger et gennemsigtig png billede.

Hvis hardware acceleration er slået til (opera:config#UserPrefs|EnableHardwareAcceleration) i Opera 12.11 så virker det ikke hvis man forsøger at tegne på et canvas som er over 8192 pixels bredt eller højt.
Det på være fordi den maksimale texture størrelse på grafikkortet er 8192 x 8192.
Browseren understøtter ikke <canvas>
Resultatet ovenfor er skabt af følgende kode

Hvis man i Opera 12.11 højreklikker på en <audio> afspiller med en wav fil og vælger Gem lyd... så gemmes lydfilen som .ogg selvom det er en .wav fil hvilket kan give lidt forvirring (den konverter ikke filerne). Men vælger man Kopier lydadresse så får man den rigtige fil.

<audio> og <video> kan finde på at være ude af kontrol i mange sekunder hvor lyden/videoen afspiller men man kan ikke stoppe eller skrue op og ned for lyden.

Lydstyrken kan være nogen sekunder om at skifte fra man trykker til ændringen rent faktisk sker.

Lyden hakker hvis man skifter program (som om bufferen ikke er så stor).

Selvom lyden skulle være muted fra JavaScript fra starten så når man afspiller så er det lyd alligevel.

De oga/ogv filer jeg havde konverteret med ffmpeg2theora's standard indstillinger havde problemer i Opera.
"Fejlen" gjorde at markøren i <audio> og <video> afspilleren ikke vises og man kan ikke søge.
Punkterne i kontekstmenuen er deaktiveret.
Der går også ud over "element.src" og at vise lydstyrken til at starte med.
Der står 0:00 selvom der afspilles.
Hvis man så trykker på play/pause knappen så opdateres tiden indtil næste gang man trykker.
Løsningen er at bruge --no-skeleton parameteren når man bruger ffmpeg2theora fra kommandoprompten.
Ved --no-skeleton står "disables ogg skeleton metadata output" som ellers gør noget Opera ikke kan lide.

Safari

Safari logo
Fryser når jeg bruger webm video containeren. Måske var det fordi HTTP serveren (Apache) ikke havde tildelt nogen MIME type til filer som ender på .webm.
Nu efter MIME typen er sat fryser Safari ikke.

Kan finde på at crashe ved nogle MP4 videoer.
Jeg ved ikke helt hvorfor ved for eksempel videoer/big_buck_bunny.mp4 kan den finde på at crashe når man forsøger at afspille den.

Det ser ud til at en nyere version af Safari ikke crasher ligesom den gamle version gjorde.

I en ny installeret Safari 5.1 får jeg denne fejlbesked hvis jeg går ind på en side med <audio> eller <video>.
Safari fejlbesked
QTCF.dll filen har sikkert noget med QuickTime at gøre.
Hvis man genstarte Windows så virker det.

Safari er afhængig af QuickTime. Hvis QuickTime ikke er installeret så kan Safari ikke afspille lyd og videofiler i <audio> og <video>. Hvilket jo lidt modarbejder det med at browseren kan afspille uden brug af plugins.

Nogen gange vises poster billedet ikke i en <video poster="billede.xxx">.
Hvis man så opdater siden så vises billedet nogen gange og nogen gange ikke.

Safari på iPhone

Safari logo
Jeg har oplevet disse "problemer" i Safari 6.0 på iPhone.

Kan ikke justere/muted lyden på <audio> og <video> fra JavaScript.
Lydstyrken siger bare 100% lige meget hvordan man skruer op og ned på telefonen.

<video> kan kun afspiller i fuldskærm... hvor man måske gerne ville have den bare afspillede der hvor videoen nu var.

Ingen preload af <audio> og <video> før brugeren vælger at afspille.

http://blog.millermedeiros.com/unsolved-html5-video-issues-on-ios/

Det lader til at <audio> og måske også <video> optager plads selvom man ikke har brugt controls attributten. Så hvis man har 20 <audio> lige efter hinanden så kommer der et tomt område selvom der ikke burde være noget.
En løsning til dette problem er muligvis fundet hos http://necolas.github.io/normalize.css/ (men har ikke testet det endnu).


Problemer med nogle MP4 videoer som ikke vil afspille. Det er nok noget med codec der virker på desktop udgaven men ikke på mobil udgaven.

YouTube videoer virker hvis ikke man laver fallback eller bruger youtube-nocookie.com.

Dette virker (youtube.com uden fallback).


Dette virker ikke (youtube-nocookie.com).


Dette virker ikke (med fallback).


Her følger nogen problemer jeg oplever med min hjemmeside.

Problemer med netkoder.dk i Safari på iPhone

Stort mellemrum over bokse i http://netkoder.localhost/netkoder/lyd_soundboard.php på iPhone på grund af <audio> optager plads.

Kylling og bamse .mp4 virker ikke på iPhone

Chernobyl og andre videoer hakker kort hakket på iPhone QuickTime

Casper og mandril vil ikke afspille på track side
virker ikke :
Video: MPEG4 Video (H264) 320x240 25.013fps [VideoHandler - MPEG4 Video (H264)]
Audio: AAC 44100Hz mono 36kbps [SoundHandler - MPEG-4 Audio]
virker :
Video: MPEG4 Video (H264) 368x240 29.727fps [VideoHandler - MPEG4 Video (H264)]
Audio: AAC 48000Hz stereo [SoundHandler - MPEG-4 Audio]
virker ikke :
Video: MPEG4 Video (H264) 524x350 30.452fps [VideoHandler - MPEG4 Video (H264) (dan)]

Eftersom iPhone afspiller videoer fuldskærm så kan JavaScript tekster ikke vises

Vent venligst,,, for bred i boks

Transform demo for bred og plads oven

Canvas maleri kan kun prik tegne
Dobbelt klik og træk virker ikke
Scooter animation indlæser billede hver gang skifter
Webgl video virker ikke - Video: MPEG4 Video (H264) 524x350 30.452fps [VideoHandler - MPEG4 Video (H264) (dan)]
Kan ikke trykke på de drop-down menu punkter som er over en <video> (eller en YouTube video efter den har været afspillet) når controls er på.

Chrome

Chrome logo

Chrome fortæller i JavaScript med canPlayType('audio/wave; codecs=\"1\"') at den ikke understøtter MIME typen "audio/wave" selvom den egentligt gør.
Samtidig siger den at den understøtter "audio/wav" (uden e).
Vil ikke afspille wav filer sat med <source type="audio/wave"> men vil gerne med <source type="audio/wav"> eller hvis der ikke er sat nogen type.

Jeg har nogen wav lydfiler som af en eller anden grund lyder dårligere i Chrome hvor de lyder fint i andre browsere.
Der er mere støj på lyden i Chrome på wav filerne.

Lydstyrkereguleringlen blive klippet af hvis afspilleren er inde i noget med overflow: auto;.
chrome lydstyrkeregulering klippet over

Engang jeg vil afspille <video> med en mp4 fil så fik jeg denne fejlbesked.
chrome.exe - indgangspunktet blev ikke fundet procedureindgangspunktet xmlReadMemory blev ikke fundet i DLL-biblioteket libxml2.dll.
Og så står der "Missing Plug-in" hvor videoen skulle have været.
chrome HTML5 video missing plug-in
Det har noget med et DivX plugin at gøre.
Hvis man i Chrome går til chrome://settings/extensionSettings og slår DivX plugin fra så virker mp4 videoer igen.

Farven på scrollbaren bliver lidt mere blå hvis jeg bruger <video> med src attributten eller med <source>.
chrome scrollbar ændre farve til blå
Hvis man ændre vinduets størrelse kan scrollbarene helt eller delvist forsvinde.
chrome scrollbar ændre farve og forsvinder

Internet Explorer

Internet Explorer logo

MP4 videoer skal være encoded i "H.264 MPEG-4 part 10 AVC" for at browseren kan afspille videoen.
Hvis videoen er encoded i MPEG-4 kan den ikke afspilles.

IE9 : Der tilføjes 8 pixels over og under <audio> så man ikke kan placer noget over og under afspilleren uden at det ligner der er mellemrum.
Internet Explorer audio 8 pixels margin over og under
IE10 : Der tilføjes 5 pixels over og under <audio> så man ikke kan placer noget over og under afspilleren uden at det ligner der er mellemrum.
Internet Explorer audio 5 pixels margin over og under

IE9 : Når afspillerens bredde (<audio> eller <video>) er 272 pixels eller mindre så vises der kun en start/pause knap når controls er sat til. Knappen er placeret i midten både vandret og lodret. Når afspillerens bredde er 273 pixels eller mere så vises de normale controls nederst i afspilleren.
272 pixels bred :
273 pixels bred :
IE10 : Her er der ikke 272-273 pixels problemet. controls er den samme lige meget hvad størrelse afspilleren har men når afspilleren er under 58 pixels bred eller under 42 pixels høj så vises controls (play knappen) ikke.
58 pixels bred :
57 pixels bred :
IE11 :
Under 80px bred ingen controls. Også ved 80 vises play knap også ved 140, 256, 343 og 459 visere flere og flere controls.
Standard højde ser ud til at være 74px. Under 74px mases controls sammen.
Jeg har oplevet at en MP3 fil som er lavet i Audacity med LAME ikke kan afspilles i Internet Explorer.

Hvis man laver en afspiller med en fil kaldet "lydfil.mp3" så hvis man højreklikke på afspilleren og vælger "Gem lyd som..." så er filnavnet ændret til "lydfil.mpeg".
"lydfil.mp4a" bliver til "lydfil.mp4".
Browseren bruger åbenbart MIME typen som filendelse (audio/mpeg, audio/mp4).

Skriv din kommentar

Spørg mig om hvad som helst
Du kan også skrive direkte til mig på
Stem
Søg
Language

Select English to navigate the website in English. Things like the navigation menu and contact form will be in English, but the main content on each page will not be translated.