19066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project<html> 29066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project <head> 39066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project <style type="text/css"> 49066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project body { background-color: black; } 59066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project a:hover { text-decoration: none; } 69066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project a:link { color: black; } 79066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project a:visited { color: black; } 89066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project #main { 99066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project position: absolute; 109066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project left: 0%; 119066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project top: 0%; 129066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project width: 100%; 139066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project height: 100%; 149066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project padding: 0%; 159066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project z-index: 10; 164d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard background-size: 100%; 174d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard background: no-repeat; 184d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard background-position: center; 194d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard } 204d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard #play { 214d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard position: absolute; 224d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard left: 50%; 234d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard top: 50%; 244d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard } 254d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard #logo { 264d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard position: absolute; 274d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard bottom: 0; 284d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard right: 0; 299066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project } 309066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project </style> 319066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project </head> 326fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke <body id="body"> 336fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke <script type="text/javascript"> 346fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke function setup() { 356fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke var width = document.body.clientWidth; 366fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke var height = document.body.clientHeight; 374d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard var mainElement = document.getElementById("main"); 384d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard var playElement = document.getElementById("play"); 396fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke var loadcount = 0; 404d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard var POSTER = "http://img.youtube.com/vi/VIDEO_ID/0.jpg"; 416fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke 424d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard function doload() { 434d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard if (++loadcount == 2) { 444d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard // Resize the element to the right size 454d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard mainElement.width = width; 464d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard mainElement.height = height; 474d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard mainElement.style.backgroundImage = "url('" + POSTER + "')"; 484d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard // Center the play button 494d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard playElement.style.marginTop = "-" + play.height/2 + "px"; 504d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard playElement.style.marginLeft = "-" + play.width/2 + "px"; 514d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard playElement.addEventListener("click", function(e) { 524d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard top.location.href = "vnd.youtube:VIDEO_ID"; 534d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard }, false); 546fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke } 556fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke } 566fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke var background = new Image(); 576fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke background.onload = doload; 584d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard background.src = POSTER; 596fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke play = new Image(); 606fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke play.onload = doload; 616fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke play.src = "play.png"; 626fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke } 634d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard 646fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke window.onload = setup; 656fad943d196b52cf5692bbb4e4ae0e495cffbbaeLeon Clarke </script> 669066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project <div id="main"> 674d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard <img src="play.png" id="play"></img> 684d49c7f04ab34686de0da5aba6f7427a151c471dNicolas Roard <img src="youtube.png" id="logo"></img> 699066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project </div> 709066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project </body> 719066cfe9886ac131c34d59ed0e2d287b0e3c0087The Android Open Source Project</html> 72