jQuery CrossDomain iframe Функция мышиного перемещения - PullRequest
Новая
       11

jQuery CrossDomain iframe Функция мышиного перемещения

0 голосов
/ 30 июля 2011

Я работаю над проектом, в который я встраиваю видео Vimeo FULLSCREEN, используя код: 

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

Я использую функцию Mousemove на родительской странице для отображения логотипа компании на 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() {
                    $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 над встроенным полноэкранным видео, и поэтому логотип Div не отображается ...

Использование CSS pointer-events: none; Работает, но отключено управление проигрывателем видео.

Есть ли какое-нибудь решение?

Спасибо

1 Ответ

0 голосов
/ 30 мая 2012

Попробуйте прикрепить событие mousemove в 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);

    });
...