Otomatik oynat ve jquery ile html5 sesi durdur

Question

Küçük bir sorunum var.

Yer paylaşımında kutu penceresi gibi bir facebookum var. Bu kutu, kullanıcı tıkladığında gizlenir - açıkçası. Bu pencere göründüğünde ses öğesini kullanmak istiyorum ve bu pencere gizlendiğinde sesi durduracağım. Yani bu benim html ve jquery. Lütfen bana yardım et.

<audio id="audio_player" loop="loop"> 
    <source src="fileadmin/templates/main/crowd.mp3" type='audio/mpeg; codecs="mp3"'> 
    <source src="fileadmin/templates/main/crowd.ogg" type='audio/ogg; codecs="vorbis"'> 
</audio> 

$(document).ready(function(){ 
function audio_player(){ 
    if (
     $('fb_like_box').css('display','block')){ 
      $('audio').each(function() { 
       var song = $(this); 
        song.play(); 
       }); 
    } 
    else if (
     $('fb_like_box').css('display','none')) { 
      $('audio').each(function() { 
       var song = $(this); 
        song.pause(); 
       }); 
    } 
    else {} 
} 
}); 

Answer 1

Kullanım :visible seçici ve fb_like_box nedir göre . veya # ekleyin. fb_like_box geçerli bir seçici değil. bunu varsayarsak ben asıl sorun facebook alan gizli olur anda, bu nedenle, yeterli dinleyici de işlevi ekler gerektiğinde işlevi çalıştırmak gerektiğini düşünüyorum bir kimlik

if ($('#fb_like_box').is(':visible')){ 
     // like box visible, play audio 
      $('audio').each(function() { 
       var song = $(this); 
        song.play(); 
       }); 
    } 
    else { 
     // like box hidden pause audio 
      $('audio').each(function() { 
       var song = $(this); 
        song.pause(); 
       }); 
    } 

Answer 2

bu. Çünkü bu durumda o DOMAttrModified 'olacağını düşünüyorum:

Bazı yalancı kod (değil test kodu):

$('facebookelementtohide').addEventListener('DOMAttrModified', function(e){ 
    audio_player(); 
}, false); 

Answer 3

Kodunuz sözdizimsel yanlış.

Her şeyden önce, aşağıdaki sözdizimi değer atamak içindir. Eğer bu kadar, böyle bir şey kullanmak zorunda, bunu kontrol etmek isterseniz

$('#fb_like_box').css('display','block') 

Bu eleman $('#fb_like_box');

mülkü block atar:

if($('#fb_like_box').css('display') == 'block') { 
    // then do something 
} 

ne yapacağını iyi bir yolu, deniyor:

if ($('#fb_like_box').is(':visible')) { 

    $('audio').each(function() { 
     $(this).play(); 
    }); 

} else { 

    $('audio').each(function() { 
     $(this).pause(); 
    }); 

} 

Answer 4

Çok basit bir şey denemek Bu, en azından sizin doğru yolda olduğunuzu bildiğinizi gösterir. Bunu oynayabildiğini öğrendikten sonra koşullarını ekleyin ve çalıştıklarını test edin.