Iframe Внутри Iframe. Можно ли это сделать?

у нас есть ссылка на видео (vimeo), которую мы хотели бы, чтобы наши пользователи смотрели.

за каждым видео следует короткая анкета.

наше намерение состоит в том, чтобы не сделать анкету видимой для пользователя, пока пользователь не нажал кнопку Открыть видео для просмотра.

Я могу думать только о встраивании кода ниже внутри другого iframe, чтобы скрыть ссылку.

это возможно?

есть альтернативный подход к этому?

<!DOCTYPE HTML>
<html>
<head>
    <meta name="google" value="notranslate" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Dog Smoking</title>

    <style type="text/css">
    body {
        padding-top:0;
        padding-bottom:0;
        padding-left:0;
        padding-right:0;
        margin-top:0;
        margin-bottom:0;
        margin-left:0;
        margin-right:0;
    }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="javascript/froogaloop.js"></script>
    <script src="javascript/froogaloop.min.js"></script>
 <script type="text/javascript">
 var iframe = $('#player1')[0],
 player = $f(iframe),
 status = $('.status');

 // When the player is ready, add listeners for pause, finish, and playProgress
 player.addEvent('ready', function() {
     status.text('ready');

     player.addEvent('pause', onPause);
     player.addEvent('finish', onFinish);
     player.addEvent('playProgress', onPlayProgress);
 });

 // Call the API when a button is pressed
 $('button').bind('click', function() {
     player.api($(this).text().toLowerCase());
 });

 function onPause(id) {
     status.text('paused');
 }

 function onFinish(id) {
     status.text('finished');
 }

 function onPlayProgress(data, id) {
     status.text(data.seconds + 's played');
}
player.addEvent('ready', function() {
    status.text('ready');
    $("#survey_button").show(); // <-- or whatever
});
</script>
</head>
<body>
    <iframe src="http://player.vimeo.com/video/4644119?api=1" width="400" height="375" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    <a href="http://show.aspx?testid=27#activate"
    target="target-iframe"
    onclick="frames['target-iframe'].document.getElementById('activate')
    .scrollIntoView();return false">Click</a>
</body>
</html>
6
html iframe javascript jquery vimeo-api

2 ответов

Я бы использовал JS API для видео и используйте обратные вызовы событий, встроенные в плеер, чтобы сделать анкету видимой.

= = UPDATE==

Ok-так что ссылка является пошаговым примером того, как включить элементы управления JS и обратные вызовы для игрока. Но... вот и мы..

Шаг 1-добавить "?api=1 " после первоначального кода вставки.

Шаг 2-загрузить свою библиотеку Froogaloop, чтобы вы могли слушать события...

Шаг 3 должен был бы настроить обратный вызов для обработки любого события, которое вы хотите прослушать... Пример прямо с этой страницы фантастический:

var iframe = $('#player1')[0],
player = $f(iframe),
status = $('.status');

// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
    status.text('ready');

    player.addEvent('pause', onPause);
    player.addEvent('finish', onFinish);
    player.addEvent('playProgress', onPlayProgress);
});

// Call the API when a button is pressed
$('button').bind('click', function() {
    player.api($(this).text().toLowerCase());
});

function onPause(id) {
    status.text('paused');
}

function onFinish(id) {
    status.text('finished');
}

function onPlayProgress(data, id) {
    status.text(data.seconds + 's played');
}

Итак, в зависимости от того, когда вы хотите, чтобы ваш опрос показал, Вы можете просто нажать на один из них...

player.addEvent('ready', function() {
    status.text('ready');
    $("#survey_button").show(); // <-- or whatever
});

смысл?

============= ЕЩЕ ОДНО ОБНОВЛЕНИЕ ================

вот рабочая скрипка:http://jsfiddle.net/QkGRd/10/. Вы можете прочитать немного о встраивание ресурсов и как работает jsfiddle.

2

TL; DR ответ

Да, вы можете иметь iframe внутри iframe. Хотя, как правило, это не очень хорошая идея с точки зрения производительности.

0