Ses yürütme üzerinde marquee başlatma

Question

Marjee etiketine html cinsinden bir zaman etiketi ayarlamanın bir yolunu bulmaya çalışıyorum. Buradaki tüm fikir, bir şarkının altyazısını seçim çerçevesi biçiminde görüntülemek ve seçim çerçevesini yalnızca kullanıcı ses başlatmayı başlattığında başlatmaktır.

I (html-5'de), ses dosyasını çalmak için aşağıdaki kodu kullanıyorum

<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> 

O anda kayan yazı başlangıç, otomatik oynatma bu ses dosyasını ayarlayın ve dinlendirilir yapıyorum sayfa yükleri (bu varsayılan ayardır) ancak bu yüksek hızlı ağlarda güzel çalışır, düşük hızlı ağlar için ortaya çıkan sorun, ses içeriğinin yüklenmesinin gecikmesi ve dolayısıyla seçim çerçevesi metnin önünden çalışmaya başlamasıdır. soğuk olmayan

Lütfen bu sorunun çözümü için javascript ile nasıl bir çözüm bulabilirim?

Answer 1

Seçim etiketinizi nasıl başlattığınızdan emin değilim, ancak play - Ses öğenizin olayı için bunu beklemeniz gerekir. Otomatik oynatma, öğe oynatılmaya başladığında bu olayı tetikler.

marquee -tag'in kullanımdan kaldırıldığını unutmayın, bunun yerine css geçişlerini kullanacağım. Bu, belirli bir className eklenerek kolayca tetiklenebilecek.

televizyonun öğenin bir kimlik verin, böylece kolayca javascript ile erişebilirsiniz:

<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> 

Ve JavaScript - Kod: Sen desteklenen tüm olayları bulabilirsiniz

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

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

W3C-Page üzerindeki medya öğeleri tarafından, ne zaman tetiklendiğine dair bir açıklama ile. Bu, javascript'te medya öğeleriyle nasıl etkileşimde bulunabileceğiniz hakkında size bir genel bakış sağlar.

Answer 2

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

başlangıçta span da şarkının adını koy:

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

Sonra sayfa yüklendiğinde marquee ile değiştirin:

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); 
}