Форум

empirik · #1 (**permalink**) 05.03.2014, 20:45

Я пытаюсь расположить блок поверх iframe, чтобы тот реагировал на действия пользователя и перенаправлял события в iframe, расположенный под ним.
Это выглядит примерно так:

<html>
<head>
<style type="text/css">
#hideme{
    background: #000;
    z-index: 100;
    position: absolute;
    opacity: 0.0;
}
iframe{
    position: absolute;
    top: 100px;
    left: 350px;
}
</style>
</head>
<body>
<iframe width="853" height="480" src="//www.youtube.com/embed/9bZkp7q19f0" frameborder="0" allowfullscreen></iframe>
<div id="hideme"></div>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
    $('iframe').load(function(){
        var iframe = $(this);

        var hideme = $('#hideme');
        hideme.width(iframe.width());
        hideme.height(iframe.height());
        hideme.css('left', iframe.position().left);
        hideme.css('top', iframe.position().top);
        
        hideme.on("click", function(event){
            iframe.trigger(event);
        });
    });
</script>
</body>
</html>

Очевидно, с помощью trigger я не могу "отправить" событие айфрейму. Может кто-нибудь пояснить, почему это не работает, и вообще, возможно ли это.

Deff · #2 (**permalink**) 06.03.2014, 02:22

empirik,
Если фрейм на ином домене, нежели главная страница, и у Вас нет возможности установки изначально своих скриптов на домене фрейма - то никак

krasovsky · #3 (**permalink**) 06.03.2014, 08:40

iframe - это элемент текущего документа, клик происходи по нему. В iframe существует "свой мир", то есть свой документ.
Так вот надо обратиться к документу во фрейме:

window.frames[0].document

И вот ему уже отправляй свои события

empirik · #4 (**permalink**) 14.03.2014, 10:52

В конечном счете, как я понял, действительно нет возможности обращаться к айфрейму, если он расположен на другом домене.
А что если спрятать блок #hideme и вызвать событие повторно? Я попробовал вот так, но что-то не получается.

hideme.on("click", function(event){
            $(this).hide();
            $(document).trigger('click', event);
        });

Форум

Справочник

Discord чат

Курсы javascript