Hello,
I am looking for a solution to use fullscreen in Object2VR HTML5 ?
I would like to break out of iframe with fullscreen like flash.
I found this note for Pano2VR:
http://gardengnomesoftware.com/bt/view.php?id=524
And tried: allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" in the iframe code.
But I don't get it to work.
Can someone help?
Thanks Koen
Fullscreen from iframe HTML5 Object2VR
- Studio PLAAT
- Posts: 18
- Joined: Thu Oct 15, 2009 12:07 pm
- Location: Amsterdam
- Contact:
- Hopki
- Gnome
- Posts: 13029
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi Koen,
Please find a project attached.
In the output folder is an index.html page. This is using the iFrame code necessary to allow HTML5 to brake out of the iFrame.
Regards,
Hopki
Please find a project attached.
In the output folder is an index.html page. This is using the iFrame code necessary to allow HTML5 to brake out of the iFrame.
Regards,
Hopki
- Attachments
-
- fullscreen.zip
- (955.21 KiB) Downloaded 1676 times
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
- Studio PLAAT
- Posts: 18
- Joined: Thu Oct 15, 2009 12:07 pm
- Location: Amsterdam
- Contact:
Hi Hopki,
Thanks for the quick support!
Got it working in desktop browsers
Unfortunately Ipads refuse to go in full screen-mode.
Any suggestion?
Regards, Koen
Thanks for the quick support!
Got it working in desktop browsers
Unfortunately Ipads refuse to go in full screen-mode.
Any suggestion?
Regards, Koen
- Hopki
- Gnome
- Posts: 13029
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi Koen,
The mobile Safari can not use the fullscreen API. You will have to just add all the page code in your web page then the fullscreen button will fill the window.
Regards,
Hopki
The mobile Safari can not use the fullscreen API. You will have to just add all the page code in your web page then the fullscreen button will fill the window.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
- Studio PLAAT
- Posts: 18
- Joined: Thu Oct 15, 2009 12:07 pm
- Location: Amsterdam
- Contact:
Hi Hopki,
Great thanks!
Got it working with the DIV (without iframe) inside the page.
Cheers,
Koen
Great thanks!
Got it working with the DIV (without iframe) inside the page.
Cheers,
Koen
Hi Martin!Hopki wrote:Hi Koen,
Please find a project attached.
In the output folder is an index.html page. This is using the iFrame code necessary to allow HTML5 to brake out of the iFrame.
Regards,
Hopki
This solution could be awesome, but.... I found out that it does not work in IE.
In IE8 only a part at the top does appear (about 20%) and with IE 10 it gives a scroll bar, despite "scrolling="no"
I really hope you have a solution!
Frans
- Hopki
- Gnome
- Posts: 13029
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi Frans,
Try this iFrame code:
Change the src to point to your file and change the name and size.
To remove scroll bars try making the iframe slightly larger then the project.
Regards,
Hopki
Try this iFrame code:
Code: Select all
<iframe src="pano.html" name="panorama" width="640" height="480" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" style="float:left; margin-left:0px" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
To remove scroll bars try making the iframe slightly larger then the project.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
Hi Martin,
Did what you suggested, I think. Unfortunately without result.
This is the div.html
I can tell you that in IE there is a Script error:
An error occured on the script on this page.
Line 39 Char. 4
Object doesn't support property or method 'AddEventListener'
Code 0
Firefox give also about 1/3 of the pano.
Chrome and Safari (all desktop) are ok.
Here the link of the test page:
http://www.360360360.nl/vbwebpagina/
Hope you can solve this problem. Would make life a lot easier. Thanks in advance!
Frans
Did what you suggested, I think. Unfortunately without result.
This is the div.html
Code: Select all
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title></title>
</head>
<body style="margin: 0">
<div style="margin: 0 auto; width:100%; height:100%;">
<object type="text/html" data="zenw" style="width:100%; height:100%; margin:0%;">
</object>
</div>
</body>
</html>
An error occured on the script on this page.
Line 39 Char. 4
Object doesn't support property or method 'AddEventListener'
Code 0
Firefox give also about 1/3 of the pano.
Chrome and Safari (all desktop) are ok.
Here the link of the test page:
http://www.360360360.nl/vbwebpagina/
Hope you can solve this problem. Would make life a lot easier. Thanks in advance!
Frans
- Hopki
- Gnome
- Posts: 13029
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi Frans,
As far as I know this is down to mobile Safari.
Regards,
Hopki
As far as I know this is down to mobile Safari.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
Hello,Hopki wrote:Hi Koen,
Please find a project attached.
In the output folder is an index.html page. This is using the iFrame code necessary to allow HTML5 to brake out of the iFrame.
Regards,
Hopki
I am sorry but i have tested the attached file
http://gardengnomesoftware.com/forum/do ... hp?id=2472
and full screen don't work on IE10
(ok in FF , Chrome , Safari)
do you have solution for IE10?
see my another post : http://gardengnomesoftware.com/forum/vi ... f=6&t=8570
Regards.
- Hopki
- Gnome
- Posts: 13029
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi,
IE10, I thought it supported the new HTML5 fullscreen API?
Can anyone else test this, my computers are all in storage at the moment as in between moving houses. Working from a mac book so can not test.
Regards,
Hopki
IE10, I thought it supported the new HTML5 fullscreen API?
Can anyone else test this, my computers are all in storage at the moment as in between moving houses. Working from a mac book so can not test.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
The IE 10 and Chrome solution for Full Screen (I think)
I did change the files in 'fullscreen' of Hopki in this topic as follows:
The iFrame in the index.html of the website:
<iframe src="div.html" scrolling="no" width="700px" height="480px" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" frameborder= "0" ></iframe>
The div.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title></title>
</head>
<body style="margin: 0">
<div style="margin: 0 auto; width:700px; height:480px;">
<object type="text/html" data="panos" style="width:100%; height:100%; margin:0%;">
</object>
</div>
</body>
</html>
You can put the map "panos" where you want as long you pointing to it.
The index.html of the panorama:
if (swfobject.hasFlashPlayerVersion("9.0.0")) {
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "pano";
attributes.name = "pano";
attributes.align = "middle";
swfobject.embedSWF(
"start.swf", "container",
"100%", "100%",
"9.0.0", "",
flashvars, params, attributes);
} else // check for CSS3 3D transformations and WebGL
if (ggHasHtml5Css3D() || ggHasWebGL()) {
// create the panorama player with the container
pano=new pano2vrPlayer("container");
// add the skin object
skin=new pano2vrSkin(pano);
// load the configuration
pano.readConfigUrl("start.xml");
// hide the URL bar on the iPhone
hideUrlBar();
}
} else ... } was the most difficult to find. In the output of Pano2VR it's before if (swfobject.hasFlashPlayerVersion("9.0.0")) {
Frans
I did change the files in 'fullscreen' of Hopki in this topic as follows:
The iFrame in the index.html of the website:
<iframe src="div.html" scrolling="no" width="700px" height="480px" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" frameborder= "0" ></iframe>
The div.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title></title>
</head>
<body style="margin: 0">
<div style="margin: 0 auto; width:700px; height:480px;">
<object type="text/html" data="panos" style="width:100%; height:100%; margin:0%;">
</object>
</div>
</body>
</html>
You can put the map "panos" where you want as long you pointing to it.
The index.html of the panorama:
if (swfobject.hasFlashPlayerVersion("9.0.0")) {
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "pano";
attributes.name = "pano";
attributes.align = "middle";
swfobject.embedSWF(
"start.swf", "container",
"100%", "100%",
"9.0.0", "",
flashvars, params, attributes);
} else // check for CSS3 3D transformations and WebGL
if (ggHasHtml5Css3D() || ggHasWebGL()) {
// create the panorama player with the container
pano=new pano2vrPlayer("container");
// add the skin object
skin=new pano2vrSkin(pano);
// load the configuration
pano.readConfigUrl("start.xml");
// hide the URL bar on the iPhone
hideUrlBar();
}
} else ... } was the most difficult to find. In the output of Pano2VR it's before if (swfobject.hasFlashPlayerVersion("9.0.0")) {
Frans