Is it possible to scroll a movieclip inside a swf with the browser scrollbar?

[niklasinla]

Does anyone know if it is possible to scroll a movieclip inside a swf with the browser scrollbar? I'm not talking about something like swfFit or so but actually controling a mc on stage while the rest of the swf stays in place?
I've seen this done in a site that I don't remember the url to.
Don't know though if they placed a div containing a swf on top of the "main" swf.
Niklas

[Beathoven]

I have never done it but the way I would go about it is find one of those javascripts where an image or a menu moves when you scroll a html page. Then find a tutorial about communicating between actionscript and javascript. Then mix the 2 together so you receive the scrolling values.

You'd have to use that same javascript to move your main swf along the page when you scroll.

[Beathoven]

Can you post a link to that website?

[5TonsOfFlax]

If you set the css style of the flash object in html to position:static, it should remain in the same place regardless of browser scrolling. Then, you can use some ExternalInterface magic to register an event listener with the html document to inform the flash when a scroll event happens.

How you'll get the html page to be the same size as the flash measurement, I don't know.

[Beathoven]

If you put a bunch of <p> </p> in the html you should get the required length.

[Beathoven]

Or even just 1 set of <p> </p> tags and change the height of the <p> tag in css to whatever height you need.

[5TonsOfFlax]

That's a terrible method. All you really need to do is set the body css height to the desired swf height. Maybe do the same to a div inside the body in case IE is as retarded as it usually is.

[Beathoven]

Best solution so far.

[niklasinla]

Hi guys - thanks for the answers!
I can't post a link to that website because I don't remember the url.
As I wrote - I'm not looking for something like SWFFit -
http://swffit.millermedeiros.com/
I use that all the time for my flashbased websites.
I'm not sure if you guys understand what I would like to achieve so I'll explain in more detail.

I'm looking to scroll a movieclip on a stage where the swf-object is set to 100% width & 100% height. So I'm not looking to scroll the main swf that is embedded in html. Instead content within the swf - let say a movieclip or a textfield - but using the browser scrollbar instead of a scrollbar made in flash.

I would go about it is find one of those javascripts where an image or a menu moves when you scroll a html page. Then find a tutorial about communicating between actionscript and javascript. Then mix the 2 together so you receive the scrolling values.

sounds like it might be a solution.

So does:

If you set the css style of the flash object in html to position:static, it should remain in the same place regardless of browser
scrolling. Then, you can use some ExternalInterface magic to register an event listener with the html document
to inform the flash when a scroll event happens.

Not sure what you mean with "How you'll get the html page to be the same size as the flash measurement, I don't know."

I'll guess I will have to experiment some here...
Thanks for the interest in my post...

Niklas

[5TonsOfFlax]

We did understand you. You did not understand us.

Set the position of the html flash object to static. Make sure the document body is as tall as the flash content which must be scrolled. Set up javascript listeners for scroll events to call actionscript methods with the scroll values.

[niklasinla]

After some search I actually found that url!!
http://www.smithreklambyra.com/#News/
If you scroll using the browser scrollbar you scroll thru their news section...

Niklas

[5TonsOfFlax]

Take a look at their source. They are using position:fixed (sorry, I thought I remembered it being "static") and in the posY.js javascript they pass the calculated scroll offsets to the flash movie.

[Beathoven]

So I feel nice today here's what I could find for you.

This is the javascript:

function f_clientHeight() {
	return f_filterResults (
		window.innerHeight ? window.innerHeight : 0,
		document.documentElement ? document.documentElement.clientHeight : 0,
		document.body ? document.body.clientHeight : 0
	);
}

function f_scrollTop() {
	return f_filterResults (
		window.pageYOffset ? window.pageYOffset : 0,
		document.documentElement ? document.documentElement.scrollTop : 0,
		document.body ? document.body.scrollTop : 0
	);
}

Those 2 functions will return the totalHeight of the document and then the scrollBar's position.

You can call those functions from within actionscript this way:

var docHeight:uint;
docHeight = ExternalInterface.call("f_clientHeight()");

var scrollVal:uint;
scrollVal = ExternalInterface.call("f_scrollTop()");

And then you can position your movieClip according to those 2 variables.

[5TonsOfFlax]

That's very generous of you, but would it not be better to have the javascript register a scroll event handler and push the values into flash?

Using jQuery, something like:

$(document.body).scroll(scrollFlash);
function scrollFlash(){
  getMovie().setScrollValues(f_clientHeight(), f_scrollTop());
}

Where flash has registered the setScrollValues function as a callback with ExternalInterface (be careful not to call setScrollValues before the flash has initialized), and the called functions are as you've defined.

[Beathoven]

And that's why you're a moderator.

[niklasinla]

Thank you so much - both of you!!'
I will have a look at this for sure...


Niklas