Question

我们希望用户观看视频（vimeo）教程。

每个视频后面都会进行简短的测验。

我们之所以这样做，是因为管理层注意到用户绕过视频并直接进入测验。

我在这里得到了一些很好的帮助：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> Video Tutorials</title>

 <script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

      <script type='text/javascript' src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script>

  <style type='text/css'>
    #surveyLink { display:none; }
  </style>

<script type='text/javascript'>//<![CDATA[ 
 var VanillaRunOnDomReady = function() {
 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() {
     player.addEvent('finish', onFinish);
 });

 function onFinish(id) {
     $("#surveyLink").fadeIn();
 }
}

var alreadyrunflag = 0;

if (document.addEventListener)
    document.addEventListener("DOMContentLoaded", function(){
        alreadyrunflag=1; 
        VanillaRunOnDomReady();
    }, false);
else if (document.all && !window.opera) {
    document.write('<script type="text/javascript" id="contentloadtag" defer="defer" src="javascript:void(0)"><\/script>');
    var contentloadtag = document.getElementById("contentloadtag")
    contentloadtag.onreadystatechange=function(){
        if (this.readyState=="complete"){
            alreadyrunflag=1;
            VanillaRunOnDomReady();
        }
    }
}

window.onload = function(){
  setTimeout("if (!alreadyrunflag){VanillaRunOnDomReady}", 0);
}//]]>  

</script>
</head>

<body>
  <body>
    <iframe id="player1" src="http://player.vimeo.com/video/39863899?api=1&player_id=player1" width="400" height="375" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    <div id="surveyLink">
    <a href="http://show.aspx?testid=27#activate"
    target="target-iframe"
    onclick="frames['target-iframe'].document.getElementById('activate')
    .scrollIntoView();return false">Click</a>
    </div>
</body>
</body>
</html>

这是小提琴

http://jsfiddle.net/QkGRd/10/

我感到困惑的是小提琴的效果与我们预期的一样，因为它可以让视频完全播放，然后才能看到Click链接。

但是，当我运行相同的代码（在我的电脑上）时，观看视频后链接不会显示。

任何想法可能出错？

我们正在尝试在查看视频教程之后仅向用户提供测验？

0 个答案: