Team:Heidelberg

From 2013.igem.org

(Difference between revisions)
Line 5: Line 5:
<html>
<html>
<style type="text/css">
<style type="text/css">
-
.fancybox-nav {
 
-
    width: 60px;     
 
-
}
 
-
 
-
.fancybox-nav span {
 
-
    visibility: visible;
 
-
}
 
-
 
-
.fancybox-next {
 
-
    right: -60px;
 
-
}
 
-
 
-
.fancybox-prev {
 
-
    left: -60px;
 
-
}
 
ul {
ul {
Line 254: Line 239:
<a href="/Team:Heidelberg/Tour" class="btn btn-default btn-lg" style="margin-left:20%; margin-top:2%">Take the Tour!</a>
<a href="/Team:Heidelberg/Tour" class="btn btn-default btn-lg" style="margin-left:20%; margin-top:2%">Take the Tour!</a>
<script src="http://www.youtube.com/player_api"></script>
<script src="http://www.youtube.com/player_api"></script>
-
<a class="fancybox fancybox.iframe" href="//www.youtube.com/embed/lwHrOqN8cj4"><img src="https://static.igem.org/mediawiki/2013/a/af/Heidelberg_video_play.png" style="margin-left:20%"></a>
+
<a class="fancybox-media" href="//www.youtube.com/embed/lwHrOqN8cj4"><img src="https://static.igem.org/mediawiki/2013/a/af/Heidelberg_video_play.png" style="margin-left:20%"></a>
       <!--<iframe class="youtube-player" type="text/html" style="width:90%; height:auto; margin-top:5%; margin-left:14%; z-index:500;" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"> </iframe>-->
       <!--<iframe class="youtube-player" type="text/html" style="width:90%; height:auto; margin-top:5%; margin-left:14%; z-index:500;" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"> </iframe>-->
   </div>
   </div>
Line 381: Line 366:
   </div><!-- /.modal -->  
   </div><!-- /.modal -->  
<script type="text/javascript">
<script type="text/javascript">
-
// Fires whenever a player has finished loading
 
-
function onPlayerReady(event) {
 
-
    event.target.playVideo();
 
-
}
 
-
// Fires when the player's state changes.
 
-
function onPlayerStateChange(event) {
 
-
    // Go to the next video after the current one is finished playing
 
-
    if (event.data === 0) {
 
-
        $.fancybox.next();
 
-
    }
 
-
}
 
   $(document).ready(function() {
   $(document).ready(function() {
     $("#langmodal").modal("show");
     $("#langmodal").modal("show");
-
     $(".fancybox")
+
     $('.fancybox-media').fancybox({
-
            .attr('rel', 'gallery')
+
openEffect  : 'none',
-
            .fancybox({
+
closeEffect : 'none',
-
                openEffect  : 'none',
+
helpers : {
-
                closeEffect : 'none',
+
media : {}
-
                nextEffect  : 'none',
+
}
-
                prevEffect  : 'none',
+
});
-
                padding    : 0,
+
   
-
                margin      : 50,
+
-
                beforeShow  : function() {
+
-
                    // Find the iframe ID
+
-
                    var id = $.fancybox.inner.find('iframe').attr('id');
+
-
                   
+
-
                    // Create video player object and add event listeners
+
-
                    var player = new YT.Player(id, {
+
-
                        events: {
+
-
                            'onReady': onPlayerReady,
+
-
                            'onStateChange': onPlayerStateChange
+
-
                        }
+
-
                    });
+
-
                }
+
-
            });
+
     });
     });
-
   
+
  </script>
-
}
+
-
</script>
+
</html>
</html>
{{:Team:Heidelberg/Templates/Footer-Start}}
{{:Team:Heidelberg/Templates/Footer-Start}}

Revision as of 19:35, 26 October 2013