<html>
<head>
<title></title>
<script type="text/javascript">
function solonumeros(evt) {
var keyPressed = (evt.which) ? evt.which : event.keyCode
return !(keyPressed > 31 && (keyPressed < 48 || keyPressed > 57));
}
function calculalo() {
document.getElementById('elalto').value=parseInt((document.getElementById('elancho').value*662)/994);
}
var ieNOTopera=document.all&&navigator.userAgent.indexOf("Opera")==-1
function iecompattest() {
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function cambialo() {
// Esto ha de estar antes que var cabecera_height
var ancho_video = document.getElementById('elancho').value;
var alto_video = document.getElementById('elalto').value;
document.getElementById('elvideo').style.width=ancho_video;
document.getElementById('elvideo').style.height=alto_video;
// Fin condicion
var window_height = ieNOTopera? iecompattest().clientHeight : window.innerHeight;
var window_width = ieNOTopera? iecompattest().clientWidth : window.innerWidth;
//FF
//var cabecera_height = document.getElementById('contenido').clientHeight;
//var pie_height = document.getElementById('pie').clientHeight;
//var cabecera_width = document.getElementById('contenido').clientWidth;
//IE
//var cabecera_height = document.getElementById('contenido').scrollHeight;
//var pie_height = document.getElementById('pie').scrollHeight;
//var cabecera_width = document.getElementById('contenido').scrollWidth;
if (document.Element || document.body){
var cabecera_height = document.getElementById('contenido').scrollHeight;
var pie_height = document.getElementById('pie').scrollHeight;
var cabecera_width = document.getElementById('contenido').scrollWidth;
} else {
var cabecera_height = document.getElementById('contenido').clientHeight;
var pie_height = document.getElementById('pie').clientHeight;
var cabecera_width = document.getElementById('contenido').clientWidth;
}
var total_Height = parseInt(cabecera_height) + parseInt(pie_height);
//alert("Ventana disponible largo " + window_height)
//alert("Ventana disponible ancho " + window_width)
//alert("Ancho Video " + ancho_video)
//alert("Ancho Cabecera " + cabecera_width)
//alert("Total " +total_Height)
if (total_Height < window_height) {
document.getElementById('veocine').style.height= window_height;
}
else
{
document.getElementById('veocine').style.height=total_Height;
}
if (ancho_video < cabecera_width) {
document.getElementById('veocine').style.width=window_width;
}
else
{
document.getElementById('veocine').style.width=parseInt(ancho_video)+20;
}
}
function modocine() {
var cuentanos = 0;
var decimas = 0;
document.getElementById('veocine').style.display='';
while (cuentanos < 80) {
decimas = cuentanos/100;
document.getElementById('veocine').style.filter='alpha(opacity='+cuentanos+')';
document.getElementById('veocine').style.MozOpacity=decimas;
document.getElementById('veocine').style.opacity=decimas;
document.getElementById('veocine').style.khtmlOpacity=decimas;
cuentanos += 10;
cuentanos = parseInt(cuentanos);
}
document.getElementById('modocine').style.display='none';
document.getElementById('modocine').style.visibility='hidden';
document.getElementById('modonormal').style.display='';
document.getElementById('modonormal').style.visibility='visible';
}
function modonormal() {
var cuentanos = 100;
var decimas = 1;
document.getElementById('veocine').style.display='none';
while (cuentanos <= 80) {
decimas = cuentanos/100;
document.getElementById('veocine').style.filter='alpha(opacity='+cuentanos+')';
document.getElementById('veocine').style.MozOpacity=decimas;
document.getElementById('veocine').style.opacity=decimas;
document.getElementById('veocine').style.khtmlOpacity=decimas;
cuentanos -= 10;
cuentanos = parseInt(cuentanos);
}
document.getElementById('modonormal').style.display='none';
document.getElementById('modonormal').style.visibility='hidden';
document.getElementById('modocine').style.display='';
document.getElementById('modocine').style.visibility='visible';
}
function opacidad(valor) {
cuentanos = document.getElementById('veocine').style.MozOpacity*100;
switch (valor) {
case "mas":
if(cuentanos < 100) {
cuentanos += 10;
cuentanos = parseInt(cuentanos);
decimas = cuentanos/100;
document.getElementById('veocine').style.filter='alpha(opacity='+cuentanos+')';
document.getElementById('veocine').style.MozOpacity=decimas;
document.getElementById('veocine').style.opacity=decimas;
document.getElementById('veocine').style.khtmlOpacity=decimas;
}
break;
case "menos":
if(cuentanos > 30) {
cuentanos -= 10;
cuentanos = parseInt(cuentanos);
decimas = cuentanos/100;
document.getElementById('veocine').style.filter='alpha(opacity='+cuentanos+')';
document.getElementById('veocine').style.MozOpacity=decimas;
document.getElementById('veocine').style.opacity=decimas;
document.getElementById('veocine').style.khtmlOpacity=decimas;
}
break;
}
}
</script>
</head>
<body>
<div id="contenido" align="center" style="" valign="top">
<div id="veocine" style="overflow: auto; display: none; opacity: 0; position: absolute; width: 100%; height: 100%; z-index: 2; left: 0px; top: 0px; background-color: rgb(0, 0, 0);">
<div id="modonormal" style="margin-top: 20px; display: none;">
<input type="button" onclick="modonormal()" value="Desactivar Modo Cine"/>
<input type="button" onclick="opacidad('menos')" value="-"/>
<input type="button" onclick="opacidad('mas')" value="+"/>
</div>
</div>
<div align="center">
<i><font color="red">* Introduce unos valores numericos para cambiar el tamaño del video (ancho/alto)</font></i>
<br/>
<i><font color="red">* el cambio de tamaño no resetea la carga del video, puedes usarlo sin problemas.</font></i>
<div>
ANCHO: <input id="elancho" type="text" onkeypress="return solonumeros(event)" onkeyup="calculalo()" maxlength="4" size="10" value="390"/>
ALTO: <input id="elalto" type="text" disabled="disabled" onkeypress="return solonumeros(event)" maxlength="4" size="10" value="259"/>
<input type="button" onclick="cambialo()" value="Cambiar Tamaño"/>
<input type="button" id="modocine" onclick="modocine()" value="Activar Modo Cine"/>
</div>
<div style="z-index:3;">
<center>
<object width="390px" height="259px">
<param name="movie" value="http://www.youtube.com/v/3BPDMXhXeAU&hl=es&fs=1&"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed id="elvideo" src="http://www.youtube.com/v/3BPDMXhXeAU&hl=es&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="390px" height="259px"></embed>
</object>
</center>
</div>
<br/>
<div id="pie" align="center" style="z-index: 3; font-family: verdana,arial; font-size: 12px; font-weight: bold;position:relative; bottom:2px;">
Resto de la página
<br/>
Todos los videos ent&aactue;n alojados en servidor ajenos
</div>
</body>
</html>