Error on Chrome Ipad/iPhone

There is a problem on iPad and iPhone with Chrome if you are linking to a tour by opening in NEW WINDOW: Se the image. I do not know if it is a new problem with last update of Chrome or how long it has existed. I discovered it by opening my tours from my Client`s website. where my tours are linked. https://dnm.dk/virtuelle-udstillinger/ I have checked it by setting up the links on my own website with same links both opening in new window and same window. Safari and Firefox has no problem. The only way to correct the page is by turning iPad to portrait and back to landscape. This makes the bottom jump up in place. Is ther a way to correct this without need of asking the client to change the opening to same window.

Please Klaus this is important. I need an answer to this.

This is ridiculous.There has been 112 visits on my post and not one has responded.

There must be hundreds of Virtual Tours which has this problem. I just doen a fast look into my bookmarks and in 5 min I found 3. You may not discover the problem until you turn the iPad to portrait an you see that there was actually a controlbar at the bottom you did not see
https://www.presidentti.fi/en/presidentialpalace360/ Check the 2 screenshots. The controlbar is not visible at bottom until you have turned the iPad to portrait and back again.

https://vaneyck2020.be

https://www.louvre.fr/en/online-tours

I have done a simple standard tour directly from krpano tour creator. And I made a testpage where you Can open it in same page or in a New Page. Try it out on iPad Chrome Your self and you Can se that there is a problem.

https://360-foto.dk/test.html

Thanks Klaus. I also came to the conclusin that it is a Chrome problen which I guess is from a new update this year. I have actually charged my old iPad from 2013 which have not been updated for at least 5 years. Everything works perfect, No problem with opening in New window. I will ask my Client to change their links if they want full support. Or maybe better ad a text above the Thumbs and ask the visitors not to use chrome or describe how to easy get it fixed by turning the iPad.

I suggest as many as possible report this bug to Google. If you have a client who link to your tours by opening it in a New Window use that for the report. Or use one of these museum sites that do it.

https://dnm.dk/virtuelle-udstillinger/

https://www.presidentti.fi/en/presidentialpalace360/

https://vaneyck2020.be

https://www.louvre.fr/en/online-tours

https://tenboom.org

https://www.smb.museum/museen-einrich…de-museum/home/

https://www.hgm.at/museum/entdecken/virtuelle-360deg-tour

Actually also Googles own tours suffer from the problem like this from the https://www.britishmuseum.org If you do not know that you can scroll down using the little menu line at the top you will not be able to see the thumbnails. Turn 90 degrees and you can see that the problem is solved just like all other tours.

I also just discovered that it can also be corrected by clicking in the adresse-line or if you use the share button and open the keyboard it will correct it selv the same way as if you turn the ipad.
Even writing the report make the page shrink and adapt. However the screenshot shows the error.

Zitat von klaus.krpano

CSS/JS workarounds might be possible but I haven't checked or tested that yet in detail.
Anyway I will have a look of course but maybe some special detection plus automatic fixes/hacks can be added...

Best regards,
Klaus

Hi Klaus I have found this site https://hullfilm.com/ The tours open in NEW page. It is actually the former regal360 creator. All the tours except the Corie Teen Boom Museum https://virtualtour.corrietenboom.com/ open correct on Chrome. I can see That all the newer ones are made the same way as far as I can see by a KOLOR template. But there are so many scripts used that I have no idea what corrects the height on Chrome. The Teen Boom Museum does not seem to be based on a Krpano script and it opens missing the full bottom buttons.

Could it be some of these CSS styles that does the correction.


<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui, viewport-fit=cover" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<style type="text/css">
@-ms-viewport { width: device-width; }
@media only screen and (min-device-width: 800px) { html { overflow:hidden; } }
* { padding: 0; margin: 0; }
html { height: 100%; }
body { height: 100%; overflow:hidden; }
div#container { height: 100%; min-height: 100%; width: 100%; margin: 0 auto; }
div#tourDIV {
height:100%;
position:relative;
overflow:hidden;
}
div#panoDIV {
height:100%;
position:relative;
overflow:hidden;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
</style>

The TenBoom tour only has thes styles <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
<style> @-ms-viewport { width: device-width; } </style>