jQuery virtual tour una extensión para simple panorama viewerr que nos permite jugar un poco más con jQuery añadiendo interactividad al transformar algunas vistas panorámicas en una visita virtual. jQuery virtual tour tiene la particularidad de ser accesible y puede funcionar incluso si el javascript no se ha activado. Para la navegación utiliza las etiquetas estándar < map > y < area /> con las cuales crearemos áreas en nuestro Tour virtual con información adicional. Quizas lo mejor sea que no hay necesidad de utilizar Flash, Quicktime o Java.
Ver Demo - Mas info jQuery virtual tour
Uso
En Nuestro encabezado < head >, realizamos las llamadas correspondientes
<link rel="stylesheet" type="text/css" href="css/jquery.panorama.css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.panorama.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("img.advancedpanorama").panorama({
auto_start: 0,
start_position: 0
/* add your execution parameters here */
});
});
</script>
<script type="text/javascript" src="js/cvi_text_lib.js"></script>
<script type="text/javascript" src="js/jquery.advanced-panorama.js"></script>
<script type="text/javascript" src="js/thickbox.js"></script>
En nuestro contenido añadimos la imagen panorámica, y creamos las áreas interactiva mediante coordenadas. Añadimos la clase “thickbox” si se trata de imágenes.
<map id="testmap" name="testmap">
<area shape="rect" coords="1653,72,1839,255" href="index.html" alt="vers la salle de formation" />
<area shape="rect" coords="2013,114,2091,210" href="img/statue1.jpg" alt="statues" class="thickbox" />
<area shape="rect" coords="1920,276,2070,351" href="img/gouges.jpg" alt="gouges" class="thickbox" />
</map>
2 Comentarios por usuarios
gracias por los recursos,
Excelente gracias !!