I've been trying to come up with a solution for locking the browser
scrolling when a swf is in focus that doesn't involve any modification
of the swf itself. Naturally, I'm using javascript focus and blur
(unfocus) events. I got it to work by setting the onfocus and onblur
params in the attributes when I embed the .swf (you can see this in
the below code, commented out).
Unfortunately, Google Chrome does not support these events as
parameters, and they must be added through addEventListener. I've
spent several hours trying different approaches to this, and none have
worked. My current code is below. The "problem code" here would be the
getElementByID towards the end. If I put an alert before that, the
alert shows. If I put one after, it does not. I have concluded that
I'm doing something wrong there.
Essentially, my problem boils down to this: How can I get a reference
to the embedded swf so that I can add event listeners to it.
<pre>
<script>
var flashvars = {
};
var params = {
menu: "false",
scale: "noScale",
allowFullscreen: "true",
allowScriptAccess: "always",
bgcolor: "",
wmode: "direct" // can cause issues with FP settings &
webcam
};
var attributes = {
id:"Wheeltest", //-------------------
IMPORTANT---------------
//onfocus:"focusIn()" , //These two lines are
important
//onblur:"focusOut()", //They handle setting the
browser scroll
on focus gain/loss
//tabindex:"1"
};
swfobject.embedSWF(
"Wheeltest.swf",
"altContent", "300", "40", "10.0.0",
"expressInstall.swf",
flashvars, params, attributes);
//---------DEFINING VARIABLES AND FUNCTIONS---------
//this variable is a boolean that will tell whether browser
scrolling is locked (true) or not (false)
var browserScrolling;
//enable or disable browser scrolling
function allowBrowserScroll(value)
{
browserScrolling=value;
}
//convention dictates that the logic to handle mouse events
based on
delta (amount of mouse movement) should be
//in a seperate function from the code that will standardize
delta
input from different browsers.
//this function simply returns the value of browserScrolling
function handle(delta)
{
if(!browserScrolling)
{
return false;
}
return true;
}
//this function will be called when the mouse is scrolled.
event is
a mouse wheel event
function wheel(event)
{
//worse case scenario: we get a bad event. in this
case, we'll just
act like the mouse
//wasn't scrolled. that means delta is 0
var delta=0;
//if the event doesn't exist, let's use the window's
event instead
if(!event){event=window.event;}
//if the event has some mouse wheel data on it
//wheelData is the property used by Internet Explorer
and opera
if(event.wheelDelta)
{
//IE and opera both report a single "tick" of
the mouse wheel as
120 delta, so we need to scale down accordingly
delta=event.wheelDelta/120;
//furthermore, opera inverts the delta value.
we correct this here
if(window.opera){delta=-delta;}
}
//detail is the property used by Firefox. in this,
"ticks" are
reported as 3, so we scale down accordingly
else if(event.detail){delta=-event.detail/3;}
//if the wheel was scrolled (delta is nonzero), we call
our handle
function
//it doesn't actually do anything in this case, and is
left in as a
matter of convention
if(delta){handle(delta);}
//if browser scrolling is disabled, we want to prevent
the
browser... from scrolling.
if(!browserScrolling)
{
//we need to make sure the preventDefault
function is defined
before we call it, thus the if statement
//prevent default will stop the default action
(browser scrolling)
if(event.preventDefault){event.preventDefault();}
//anything else taht uses this event will know
that it has failed
to execute the default behavior
event.returnValue=false;
}
//in the case that browserScrolling is true, the
browser will
scroll like normal. We need not tell it to,
//since that is the default action.
}
//will be called when the swf gains focus
function focusIn()
{
allowBrowserScroll(false);
}
//will be called when the swf loses focus
function focusOut()
{
allowBrowserScroll(true);
}
//---------SETUP MOUSE WHEEL TRAPPING---------
// we need to ensure that the addEventListener function is
defined
if(window.addEventListener)
{
//add a listener that will call our scrolling function
function
when the mouse is scrolled.
window.addEventListener('DOMMouseScroll',wheel,false);
}
//the window and the document should have the same mouse wheel
scrolling function
window.onmousewheel=document.onmousewheel=wheel;
//allow browser scroll by default.
allowBrowserScroll(true);
function addFocusListeners()
{
// alert works here
var mySwf = window.getElementByID("Wheeltest");
//problem
// alert does not work here
mySwf.addEventListener('focus', focusIn, false);
mySwf.addEventListener('blur', focusOut, false);
}
swfobject.addDomLoadEvent(addFocusListeners);
</script>
</pre>
Thanks in advance.
--
You received this message because you are subscribed to the Google Groups
"SWFObject" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/swfobject?hl=en.
