<link href="css/estilos_dock.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery_dock.js"></script>
<script type="text/javascript" src="js/interface_dock.js"></script>
<!--SCRIPT PARA OPCIONES DE MENU DOCK ========================================================= -->
<script>
function btn_inicio() { verOpcion("inicio") }
function btn_evento() { verOpcion("evento") }
function btn_somos() { verOpcion("somos") }
function btn_fotos() { verOpcion("fotos") }
function btn_videos() { verOpcion("videos") }
function btn_contacto() { verOpcion("contacto") }
function btn_rss() { verOpcion("rss") }
function btn_cerrar() { verOpcion("elementos_web") }
function verOpcion(opcion) { ocultarOpcion();
var opcs = document.querySelectorAll(".contenido." + opcion); for(var i=0, length=opcs.length; i<length; i++) { var opc = opcs[i];
opc.style.visibility = "visible";
}
}
function ocultarOpcion() { var opcs = document.querySelectorAll(".contenido"); for(var i=0, length=opcs.length; i<length; i++) { var opc = opcs[i];
opc.style.visibility = "hidden";
}
}
function ocultarOpciones(cual) {
var elElemento=document.getElementById(cual);
if(elElemento.style.display == 'none') { elElemento.style.display = 'block';
}
}
</script>
<body>
<div class="cont_escalable"><!--PRINCIPIO DE CONTENEDOR ESCALABLE-->
<!-- INICIO============================================================================================================================ -->
<div class="contenido inicio" id="opc_inicio"></div>
<!-- EVENTO============================================================================================================================ -->
<div class="contenido evento" id="opc_evento" style="display:none;">
<div class="titular_opcion">Contratar Evento</div>
<a class="opc_cerrar" href="javascript:void(0);" onclick="ocultarOpciones('opc_inicio'); ocultarOpciones('opc_marcador_inicio');">
<img src="imagenes/btn_cerrar.png" alt="Cerrar" title="Cerrar" onclick="btn_inicio()" /></a>
<div class="linea_multicolor"></div>
<div class="contenido_evento">
CONTENIDO EVENTO
</div>
</div>
<!-- SOMOS============================================================================================================================ -->
<div class="contenido somos" id="opc_somos" style="display:none;">
<div class="titular_opcion">Somos</div>
<a class="opc_cerrar" href="javascript:void(0);" onclick="ocultarOpciones('opc_inicio'); ocultarOpciones('opc_marcador_inicio');">
<img src="imagenes/btn_cerrar.png" alt="Cerrar" title="Cerrar" onclick="btn_inicio()" /></a>
<div class="linea_multicolor"></div>
<div class="contenido_somos">
CONTENIDO somos
</div>
</div>
</div>
<div class="dock" id="dock2">
<div class="dock-container2">
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_inicio'); ocultarOpciones('opc_marcador_inicio');">
<span class="fondo_titular_icono">Inicio</span><img src="images/icono_inicio.png" alt="inicio" title="inicio" onclick="btn_inicio()"/></a>
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_evento'); ocultarOpciones('opc_marcador_evento');">
<span class="fondo_titular_icono">Evento</span><img src="images/icono_contratar_evento.png" alt="evento" title="evento" onclick="btn_evento()"/></a>
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_somos'); ocultarOpciones('opc_marcador_somos');">
<span class="fondo_titular_icono">Somos</span><img src="images/icono_somos.png" alt="somos" title="somos" onclick="btn_somos()"/></a>
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_fotos'); ocultarOpciones('opc_marcador_fotos');">
<span class="fondo_titular_icono">Fotos</span><img src="images/icono_fotos.png" alt="fotos" title="fotos" onclick="btn_fotos()"/></a>
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_videos'); ocultarOpciones('opc_marcador_videos');">
<span class="fondo_titular_icono">Videos</span><img src="images/icono_videos.png" alt="videos" title="videos" onclick="btn_videos()"/></a>
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_contacto'); ocultarOpciones('opc_marcador_contacto');">
<span class="fondo_titular_icono">Contacto</span><img src="images/icono_contacto.png" alt="contacto" title="contacto" onclick="btn_contacto()"/></a>
<a class="dock-item" href="javascript:void(0);" onclick="ocultarOpciones('opc_rss'); ocultarOpciones('opc_marcador_rss');">
<span class="fondo_titular_icono">RSS</span><img src="images/icono_rss.png" alt="rss" title="rss" onclick="btn_rss()"/></a>
</div>
</div>
<div class="suelo_dock"></div>
<!--dock menu JS options -->
<script type="text/javascript">
$(document).ready(
function()
{ $('#dock2').Fisheye( { maxWidth: 60,
items: 'a',
itemsText: 'span',
container: '.dock-container2',
itemWidth: 60,
proximity: 80,
alignment : 'left',
valign: 'bottom',
halign : 'center'
}
)
}
);
</script>
</body>
