Rozpoczęcie marquee na audio play

Question

Próbuję znaleźć sposób, aby ustawić znacznik czasu do znacznika marquee w html. Cała idea polega na wyświetleniu napisów do piosenki w formacie markizy i uruchomieniu markizy tylko wtedy, gdy użytkownik kliknie, aby uruchomić audio.

Używam następujący kod do odtwarzania plików audio (w HTML-5)

<audio controls="controls" loop="loop"> 
    <source src="song.ogg" type="audio/ogg" /> 
    <source src="song.mp3" type="audio/mpeg" /> 
    Your browser does not support the audio element.Please use chrome. 
</audio> 

Co robię jest ustawiony ten plik audio na autoodtwarzanie, i niech markizy początek w chwili ładowanie stron (co jest ustawieniem domyślnym) , ale działa to dobrze w sieciach o dużej szybkości, w przypadku sieci o niskiej prędkości pojawia się problem, że ładowanie treści audio jest opóźnione, a zatem tekst markizy rozpoczyna się przed dźwiękiem. co nie jest fajne

Proszę mi doradzić, w jaki sposób mogę rozwiązać problem za pomocą javascript?

Answer 1

Nie jestem pewien, jak uruchomić znacznik markizy, ale należy poczekać na play - Zdarzenie elementu dźwiękowego, aby to zrobić. Autoodtwarzanie uruchamia to wydarzenie, gdy element zaczyna grać.

Należy zauważyć, że etykieta marquee jest przestarzała, zamiast tego użyłbym przejść css, które można łatwo uruchomić, dodając określoną nazwę klasy.

Daj Media-elementu identyfikator, dzięki czemu można łatwo uzyskać do niego dostęp z javascript:

<audio id="audio" controls="controls" loop="loop"> 
    <source src="song.ogg" type="audio/ogg" /> 
    <source src="song.mp3" type="audio/mpeg" /> 
    Your browser does not support the audio element.Please use chrome. 
</audio> 

a JavaScript - Kod:

var audioEl = document.getElementById("audio"); 

audioEl.addEventListener('play',function(){ 
    //start your marquee in here 
}); 

można znaleźć wszystkie wydarzenia, które są obsługiwane przez elementy multimedialne na W3C-Page z opisem, kiedy są uruchamiane. Daje to przegląd sposobów interakcji z elementami multimedialnymi w javascript.

Answer 2

http://jsfiddle.net/kykMs/1/

Połóż tytuł utworu w span początkowo:

<span id="song">Artist - Song Title</span> 

Następnie na stronie obciążenia zastąpić go marquee:

window.onload = function() { 
    var elem = document.getElementById("song"); 

    var marq = document.createElement('marquee'); 
    marq.innerHTML = elem.innerHTML; 

    document.getElementById("player").removeChild(elem); 
    document.getElementById("player").appendChild(marq); 
}