topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

talk show tell print

lib-flow-example-script.htm / htm



  <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html><head>
  <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
  
  <!-- 
          This is Flowplayer standalone demo. The fastest way to get started. 
          You can freely copy things on your site. All demos can be found from: 
          
          http://flowplayer.org/demos/
  	
  	Enjoy!
  -->
  
  <!-- DOCTYPE is always recommended. see: http://www.quirksmode.org/css/quirksmode.html -->
   
  
  <!-- it's recommended to load jquery directly from googleapis. fast and gzipped --> 
  <script src="lib-flow-example-files-jquery.js"></script>
  
  <!-- flowplayer scripts should be loaded from your servers NOT from static.flowplayer.org  -->
  
  <script type="text/javascript" src="lib-flow-example-files-flowplayer-3.js"></script>
  
    
  <!-- some styling for the standalone page. this line can (or must) be removed -->
  <link rel="stylesheet" type="text/css" href="lib-flow-example-files-standalone.css">
  
  <link rel="stylesheet" type="text/css" href="lib-flow-example-files-splash.css">
  
  <!-- first player -->
  </head><body><div class="player" href="http://blip.tv/file/get/KimAronson-TwentySeconds70930.flv" style="background-image: url(/img/demos/70930.jpg);">
  
          <!-- play button -->
          <img src="lib-flow-example-files-play-large.png" alt="Play this video">
  
          <!-- info -->
          <div style="opacity: 0.7;" class="info">
                  Eating sushi on a Japanese Restaurant
                  <span>duration: 20 seconds</span>
          </div>
          
  </div>
  
  <!-- second player -->
  <div class="player" href="http://blip.tv/file/get/KimAronson-TwentySeconds58192.flv" style="background-image: url(/img/demos/58192.jpg);">
  
          <!-- play button -->
          <img src="lib-flow-example-files-play-large.png" alt="Play this video">
  
          <!-- info -->
          <div style="opacity: 0;" class="info">
                  Happy Feet dancing in the car
                  <span>duration: 21 seconds</span>
          </div>
          
  </div>
  
  <!-- let page float normally after this -->
  <br clear="all">
  
  <!-- Flowplayer installation and configuration -->
  <script language="JavaScript">
  
  // begin scripting after the page is fully loaded
  $(function() {
          
          // install flowplayer and initialize mouse interactivity
          $("div.player").flowplayer("swf/flowplayer-3.1.0.swf").hover(function() {
                          
                  // find div.info element inside the player container and show it
                  $("div.info", this).fadeTo("slow", 0.7);
                  
          }, function() {
                  
                  // when mouse is removed - hide the info
                  $("div.info", this).fadeTo("slow", 0);
          }); 
          
          // initially all info elements are hidden
          $("div.info").css("opacity", 0);
          
  });
  </script>        
  
  </body></html>
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.