Tu problema está en el iframe, le tienes asignadas las siguientes propiedades: display: block; width: 980px; height: 500px;. tanto el ancho como el alto tiene unidades fijas (980px y 500px) lo que no permite que sea responsivo. en wordpress hay plugins que permiten hacer iframes responsivos o sino puedes intentar este tutorial
Es verdad… cuando yo inserto un iframe, lo hago con un ancho de 100%, lo que permite que se acomode al ancho total de la caja contenedora, en cualquier dispositivo. Si lo tienes con un ancho en píxeles, no será responsivo, en ningún caso.
Hola de nuevo, Mario.
Me resultó muy útil tu información sobre el deep linking. Ahora por fin estoy terminando el tour virtual (más de un año después). Todo funciona más o menos, pero tengo un leve problema: la barra de control se ve muy pequeña en dispositivos móviles y además no salen todos los iconos que tengo seleccionados. ¿Me puedes indicar por dónde seguir?
Muchas gracias por tus fantásticos tutoriales, vídeos, foros, etc.
PD: ¿Te veremos por España dando algún curso? Sería un placer.
Por ahora me ha funcionado bien, pero ahora quiero que se ajuste al 50% de la pantalla con relación 16:9 en pc, pero que en celulares sea siempre el 100% del ancho de pantalla…
Por allí ley que se podía hacer condicional según resolución de pantalla usando este CSS
/* CSS pantallas de 320px o superior */ @media (min-width: 320px) {
.mi-iframe {
width: 200px;
height: 150px;
}
}
/* CSS pantalla 768px o superior */ @media (min-width: 768px) {
.mi-iframe {
width: 500px;
height: 350px;
}
}
Pero me gustaría saber si alguien ha probado esto y si me puede pasar el código completo para incrustar en mi blog, ya que no soy muy bueno en esto de programación web.
MI problema es incrustando desde Round.me, hago todo y en mi ordenador se ve de maravilla pero en el celular se sale del encuadre, entonces tendría que hacerlo al 100% pero no me gusta como se ve en el blog, es decir, que en el pc se vea mas o menos en la mitad del ancho pero en celulares y tablets se pueda ver en el 100% de ancho sin distinguir si es formato horizontal o vertical… vamos se que los gurus me pueden dar una mano… Animo!!! se les quiere-
Carlos. Es un verdadero lío intentar conciliar los distintos tipos de pantalla, para los controles de un tour de PanoTour. Al menos, yo no he podido, ya que los valores de tamaño de la barra de control se determinan en píxeles, y no en unidades relativas.
Hay elementos que sí puedes manejar en unidades relativas, por ejemplo en porcentaje, en PanoTour. Por ejemplo, un logotipo. Tal vez hasta ahí he podido llegar, pero en la barra de control de botones no.
Te dejan de salir algunos botones, porque esta barra viene programada así, pues en un celular se supone que se dejan de utilizar algunos controles como el del zoom. Y se necesitan otros, como el giroscopio, así que internamente ya viene programada de esta forma.
Con la venida inminente de la tecnología VR y de las gafas Cardboard, yo casi que me dejo de preocupar por esto, ya que al activar la función de Cardboard, los controles desaparecen y tienen todo el sentido que desaparezcan. Pero sería muy interesante que a futuro, PanoTour y KR Pano ponga controles visuales, en el nadir del recorrido virtual, donde quedarían muy bien ubicados y que se puedan manejar ópticamente. Estoy seguro que a la vuelta de poco tiempo, esto será así.
Ubaldo… todo depende del lugar donde vayas a montarla en tu sitio web.
Si tienes una plantilla responsiva, lo mejor es que la medida de tu iframe sea en porcentaje y no en píxeles. De esta manera, a medida que cambie el dispositivo, el iframe se acomodará al ancho de la caja y no se desbordará.
La solución que planteas con CSS también es posible, a través de las “media queries”, esto en realidad son reglas que se aplican en función del tamaño del navegador (y del dispositivo, claro está). Así que también pueden ser usadas, pero casi que con usar unas medidas porcentuales, y dejar que la “caja” contenedora de tu sitio se adapte, estás salvado.
Buenos días,
estoy empezando a publicar fotografías esféricas y he de decir que vuestro portal me ha sido de mucha ayuda, finalmente me he decandato por el panotour pro y la web la estoy montando con wordpress. He utilizado el plugin de panopress y me la incrusta bien, pero no se activa la vision estereoscópica, en la versión de escritorio de panotour si se activa, así que dudo que sea del programa … argggg
os dejo el enlace (no se pueden reír, de momento sólo es un borrador) http://pensaten360.cat/?page_id=43
Cesc, cuando hablas de “visión estereoscópica” ¿te refieres a la visión VR? Supongo que no está funcionando porque al cargar la panorámica, estás trayendo el archivo de Flash (SWF), mira el código que me da:
Tal vez este código sea el que está poniendo el plugin PanoPress… En tal caso, te sugiero que les escribas en el foro preguntándoles de este caso particular: http://www.panopress.org/forums/
Hola Mario,
al señalarme el problema, lo que he hecho es redirigirlo al archivo *.Html, en lugar del *.Xml, ahora funciona correctamente.
A simple vista con las mismas funcionalidades, desconozco las ventajas de una o otra forma, pero de momento funcionaré con el HTMl.
Muchas gracias!!!
He estado leyendo el hilo de este tema, pero los términos de programación ,me dejan perdido.
A mi me pasa, que el tour se ve bien en el computador, pero en el celular , el logo, plano, miniaturas; no salen proporcionados se “amontonan” unos sobre otros…
En términos sencillos como corrijo eso en panotur…
Efectivamente con PanoTour todavía hay muchos problemas relacionados con la “responsividad” del tour, es decir, con la forma en que se muestra en dispositivos móviles.
Mi recomendación muchas veces es ser lo más sencillos a la hora de hacer la interfaz, de tal manera que no se vean afectados los elementos que no guardan responsividad. Solo en algunos casos concretos, he realizado una versión para móvil (VR) y otra para web… Ejemplo:
Hola Mario!
Me llamo mucho la atencion a parte del gran trabajo que realisaste…la programacion para version Móvil: http://farmfolio.net/360Views/pietrasanta/vr.
Que plugin utilizaste para el menu?
Es de panotour?
Hola Buenos días a todos, Antes de empezar quería agradecer la colaboración y ayuda de todos los que participan en este Foro, porque sirve de una gran ayuda. Particularmente A Mario que con su entusiasmo nos involucra en esta dinámica de panoramistas. Gracias . Ahora va mi pregunta en el tutorial de Mario (6 de 12) HTML y CSS bien explicado a quien nunca ha escrito una etiqueta en su vida… Que justamente es mi caso, ja, ja, se explica como duplicar una plantilla para que cuando la utilicemos con Panotour , no aparezca en las redes sociales de Faceboock, toda la publicidad de Panotour. Al final de ese Tutorial se empieza a explicar pero no termina. Alguno de ustedes me podría ayudar a saber que tengo que hacer. Gracias. Javier.
Hola panoramistas, tengo inconvenientes con KRPANO, publico las fotografías 360 pero solo se visualizan con giroscopio en dispositivos apple, alguno sabe de un código o configuración para que se visualicen el cualquier dispositivo móvil, android u otros, quedo muy atento a sus respuestas, gracias.
Javier, seguramente se trata de cómo retirar el título de los tours que dice algo así como “Nuevo Proyecto by Panotour”… Bien si te refieres a esto, es muy fácil: abres el archivo “index.html” y editas la etiqueta cambiando este título por el que a ti te convenga más.