2011-07-30 4 views
0
내가 코드를 사용하여 전체 화면 메오 비디오를 내장하고있어 어디 프로젝트에서 일하고 있어요

:이 같은 MouseMove 이벤트에 회사 로고를 보여주기 위해 상위 페이지에 MouseMove 이벤트 기능을 사용하고jQuery를 도메인 간 iframe을 MouseMove 이벤트 기능

<iframe id="iframe" src="http://player.vimeo.com/video/...../.." width="100%" height="100%" frameborder="0"></iframe> 

를 :

$(document).ready(function() { 
    var $top = $('#logo'); 
    var $document = $(document); 
    var timer = null; 
    var timerIsRunning = false; 

    $top.hide(); 

    $document.mousemove(function(e){ 
    e.stopPropagation(); 
    }); 
    setTimeout(function() { 
        $document.mousemove(function(e) { 
          if($top.is(':hidden')) { 
           $top.fadeIn(2000); 
          } else { 
           if(!timerIsRunning) { 
            timerIsRunning = true; 
            clearTimeout(timer); 
            timer = setTimeout(function() { $top.fadeOut(); }, 15000); 
            setTimeout(function() {timerIsRunning = true;}, 15000); 
           } 
          } 
        }); 
      }, 2000); 

}); 

내 문제는 ... 로고 사업부가 나타나지 않는 이유는 내장 전체 화면 비디오 & 이상 MouseMove 이벤트 기능을 감지하지 않는 브라우저입니다

CSS 사용 pointer-events: none; 작동하지만 비디오 플레이어 컨트롤을 사용할 수 없습니다.

해결책이 있습니까?

감사

답변

0

iframe을에 MouseMove 이벤트 이벤트를 연결하십시오 :

$(document).ready(function() { 
    var $top = $('#logo'); 
    var $document = $(document); 
    var timer = null; 
    var timerIsRunning = false; 

    $top.hide(); 

    $document.mousemove(function(e){ 
    e.stopPropagation(); 
    }); 
    setTimeout(function() { 
        $('#iframe',$document).mousemove(function(e) { 
          if($top.is(':hidden')) { 
           $top.fadeIn(2000); 
          } else { 
           if(!timerIsRunning) { 
            timerIsRunning = true; 
            clearTimeout(timer); 
            timer = setTimeout(function() { $top.fadeOut(); }, 15000); 
            setTimeout(function() {timerIsRunning = true;}, 15000); 
           } 
          } 
        }); 
      }, 2000); 

    });