jQuery的跨域iframe的鼠標移動功能

Question

我對項目的工作在那裏我嵌入全屏VIMEO視頻使用代碼：

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

}); 

我的問題是瀏覽器在嵌入全屏視頻&這就是爲什麼標誌格不會出現未檢測到鼠標移動功能...

使用CSS pointer-events: none;它工作但禁用視頻播放器控件。

有沒有解決方法？

感謝

Answer 1

嘗試在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() { 
        $('#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); 

    });