You are not logged in.

JS document.createElement('DIV'); in fullscreen

trzczy

Beginner

  • "trzczy" started this thread

Posts: 29

  • Send private message

1

Wednesday, March 26th 2014, 4:18pm

JS document.createElement('DIV'); in fullscreen

I created the system of displaying iframe in pano when hotspot was clicked. It worked nice and I could display several websites in iframe on the background of pano. But than I found that iframe did not appear in fullscreen mode. So my question is how to make it appear in fullscreen. Here is a sample with green div instead of iframe. It appears only when fullscreen is off:
http://ekspert.tk/234/tlo.html

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

<!DOCTYPE html>
<html>
<head>
	<title>krpano.com - tlo</title>
	<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<meta http-equiv="x-ua-compatible" content="IE=edge" />
	<style>
		@-ms-viewport { width: device-width; }
		@media only screen and (min-device-width: 800px) { html { overflow:hidden; } }
		html { height:100%; }
		body { height:100%; overflow:hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }
		#d{
			width: 111px;
			height: 66px;
			background-color: #00ff00;
			position: absolute;
			left: 50%;
			top: 50%;
		}
	</style>
</head>
<body>
<script src="tlo.js"></script>
<div id="pano" style="width:100%;height:100%;">
	<noscript><table style="width:100%;height:100%;"><tr style="valign:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript>
	<script>
		embedpano({swf:"tlo.swf", xml:"tlo.xml", target:"pano", html5:"never", passQueryParameters:true});
		function disp(){
			var d = document.createElement('DIV');
			d.setAttribute('id','d');
			document.body.appendChild(d);
		}
	</script>
</div>
</body>
</html>

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<krpano version="1.16" ispartialpano="true">
	
	<include url="skin/defaultskin.xml" />
	
	<view hlookat="0" vlookat="0" maxpixelzoom="1.0" fovmax="150" limitview="auto" />

	<preview url="tlo.tiles/preview.jpg" />

	<image type="CYLINDER" hfov="1.00" vfov="0.192063" voffset="0.00" multires="true" tilesize="512" progressive="true">
		<level tiledimagewidth="8190" tiledimageheight="1573">
			<cylinder url="tlo.tiles/l2/%v/l2_%v_%h.jpg" />
		</level>
		<level tiledimagewidth="4096" tiledimageheight="787">
			<cylinder url="tlo.tiles/l1/%v/l1_%v_%h.jpg" />
		</level>
	</image>
	<hotspot name = "hs0" url = 'hs.jpg' onclick = 'js(disp())' ath = "-0.1" atv = "-0.05"  />
</krpano>

Thank you

klaus.krpano

Administrator

Posts: 13,499

  • Send private message

2

Friday, March 28th 2014, 9:01am

Hi,

the Flashplayer Fullscreen Mode shows only Flash content - that means it takes the Flash window and shows it fullscreen, anything from the browser will and can't be there in this case.

An alternative might be trying to use the HTML5 fullscreen mode (manually by own Javascript).

Best regards,
Klaus

trzczy

Beginner

  • "trzczy" started this thread

Posts: 29

  • Send private message

3

Friday, March 28th 2014, 6:27pm

Thanks for explanation.
Best regards.

Similar threads