2 Replies - 2860 Views - Last Post: 29 May 2007 - 02:31 AM

#1 pioSko  Icon User is offline

  • still.dreaming
  • member icon

Reputation: 23
  • View blog
  • Posts: 1,888
  • Joined: 06-June 03

Resizing Flash with JavaScript

Posted 24 May 2007 - 09:24 AM

I've managed to fuse SWFObject and this piece of code to have my Flash page resizable. The problem is with CSS property overflow and a little modification which reloads the flash.

It supposed to work like this:

If the Flash content is smaller than the viewable stage area in the browser, then Flash is resized to 100%x100% of the stage area and scroll bars are hidden.

When content is changed and is larger than the stage area, then Flash height is resized to fit the content and scroll bars appear.


It does this: (http://www.piosko.pl/resize/ ... you may need to resize your browser window)
If the content is larger then stage area, it resizes page then reloads page (that's what it looks like)


The Javascript code set's the height of the div where the flash is, and changes the overflow style value to either "hidden" if content is smaller, or "visible" if larger.


The code:

java script:
function setFlashHeight(divid, newH){
	var winH = 0;

	if (parseInt(navigator.appVersion) > 3) {
		if (navigator.appName=="Netscape") {
			winH = window.innerHeight;
		}
		if (navigator.appName.indexOf("Microsoft") != -1) {
			winH = document.body.offsetHeight;
		}
	}
	
	if(newH > winH) {
		document.getElementById(divid).style.height = newH + "px";
		document.getElementById(divid).style.overflow = "visible";
	} else {
		document.getElementById(divid).style.height = winH + "px";
		document.getElementById(divid).style.overflow = "hidden";
	}
}


CSS:
html {
	height: 100%;
}			

#flashcontent {
	height: 100%;
	overflow: auto;
}

body {
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: #666666;
}



HTML:
<body>
		<div id="container">		
			<div id="flashcontent">
				<div id="noflash">

					HTML version in development. Please install Flash Player 6 or greater in order to view Flash version.
				</div>
			</div>		
		</div>
		
		<script type="text/javascript">
			var so = new SWFObject("resize.swf", "index", "100%", "100%", "8", "#7f8d8c");
			so.addVariable("ALIGN", "true");
			so.addParam("scale", "noscale");
			so.addParam("quality", "high");			
			so.addParam("allowScriptAccess", "sameDomain");
			so.useExpressInstall("expressinstall.swf");
			so.write("flashcontent");
		</script>

	</body>


Any help will be appreciated.

Is This A Good Question/Topic? 0
  • +

Replies To: Resizing Flash with JavaScript

#2 pioSko  Icon User is offline

  • still.dreaming
  • member icon

Reputation: 23
  • View blog
  • Posts: 1,888
  • Joined: 06-June 03

Re: Resizing Flash with JavaScript

Posted 28 May 2007 - 03:27 AM

Anybody? :( :( :(
Was This Post Helpful? 0
  • +
  • -

#3 pioSko  Icon User is offline

  • still.dreaming
  • member icon

Reputation: 23
  • View blog
  • Posts: 1,888
  • Joined: 06-June 03

Re: Resizing Flash with JavaScript

Posted 29 May 2007 - 02:31 AM

Figured it out.

In the Flash movie I had a function which changes things when the browser window is resized. Whenever the Javascript function was called, and inevitably added the scroll bars, that redrew the screen and therefore recalled my function in Flash which in turn fucked things around... technically speaking.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1