jplayer가 일시 중지시 배경을 변경합니다.

Question

오디오 플레이어 인 제 Jplayer에 문제가 있습니다. isPaused에 액세스하는 데 문제가 있습니다. 내가해야 할 일은 플레이어가 플레이 할 때 div의 배경 이미지를 변경해야한다는 것입니다. 두 가지 테스트 스크립트가 있는데 제대로 작동하지 않습니다.

내 선수

var myCirclePlayer = new CirclePlayer("#jquery_jplayer_1", 
    { 
     mp3: "/media/audio/RelaxSeg.mp3", 
    }, { 
     supplied: "mp3", 
     cssSelectorAncestor: "#cp_container_1", 
     swfPath: "/jQuery.jPlayer.2.2.0/v11/js", 
     wmode: "window" 
}); 

내 containter.

<div id="jquery_jplayer_1" class="cp-jplayer"></div> 
    <div id="cp_container_1" class="cp-container" style="background:none;"> 
    <img id="bg_image" class="bg_image1" src="/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_img.png" height="60" /> 
     <div class="cp-progress-holder"> <!-- .cp-gt50 only needed when progress is > than 50% --> 
      <div class="cp-progress-1"></div> 
      <div class="cp-progress-2"></div> 
     </div> 

    <div class="cp-circle-control"></div> 
     <ul class="cp-controls"> 
      <li><a id="play1" class="cp-play" tabindex="1">play</a></li> 
      <li><a id="pause1" class="cp-pause" style="display:none;" tabindex="1">pause</a></li> <!-- Needs the inline style here, or jQuery.show() uses display:inline instead of display:block --> 
     </ul> 


    </div>   

이것은 작동해야하지만 어떤 이유로는 그렇지 않습니다.

if($("#jquery_jplayer_1").data("jPlayer").status.isPlaying) { 
    $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_image_green.png"); 
    } 
    else { 
    $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_img.png"); 
    } 

는 또한 플레이어가 재생되지 않을 때, 일시 정지 버튼이 표시되지 않습니다 중 하나가 작동을 doenst이 코드를 가지고 있고, 플레이어가 재생 될 때, 그 스타일은 디스플레이 = 블록이된다.

if(document.getElementById("pause1").style.display = "block") { 
    $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_image_green.png"); 
    } 

if(document.getElementById("pause1").style.display = "none") { 
    $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_img.png"); 
    } 

나는 코드 블록에 대해 사과하지만 나는 아무것도 남기고 싶지 않다.

Answer 1

당신은 같은 것을 수행하여 jPlayer의 play, pause 및 end 이벤트에 연결할 수 있습니다 :

var myCirclePlayer = new CirclePlayer("#jquery_jplayer_1", 
{ 
    mp3: "/media/audio/RelaxSeg.mp3", 
}, { 
    supplied: "mp3", 
    cssSelectorAncestor: "#cp_container_1", 
    swfPath: "/jQuery.jPlayer.2.2.0/v11/js", 
    wmode: "window", 
    play: function() { 
     $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_img.png"); 
    }, 
    pause: function() { 
     $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_image_green.png"); 
    }, 
    ended: function() { 
     $(".bg_image1").attr("src", "/jQuery.jPlayer.2.2.0/v11/circle.skin/jplayer_bg_image_green.png"); 
    } 
    });