PDA

View Full Version : Animated Collapsible - swf will reload in FIREFOX



oris
08-07-2010, 04:26 PM
1) Script Title: Animated Collapsible DIV

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

3) Describe problem:
I set a swf in a div ,when sliding down(and sliding up), the section causes a Flash animation abnormally reloading again and again which becomes a a scrambled image .:confused:

this is my testpage:
http://kt1.kehch.com/_o/test/main.html

thank you very much guys:p

ddadmin
08-08-2010, 12:25 AM
Are you able to control the playing of the Flash animation using JavaScript? If so, you can try taking advantage of the ontoggle event handler (http://www.dynamicdrive.com/dynamicindex17/animatedcollapse_suppliment.htm) of the script to basically stop the animation whenever a corresponding DIV is collapsed, and play it when it's expanded.

oris
08-08-2010, 08:28 AM
thank you for your help ,I try ,but it has error message like this:
"
An error exists inside your "ontoggle" function:

TypeError: document.getElementById("peterflashobj") is null

Aborting execution of function.
"

i don't know what the error in code ,this is my test page....

http://kt1.kehch.com/_o/test/main2.html

jscheuer1
08-08-2010, 12:23 PM
It means just that. There is no element with the id 'peterflashobj' on the page. You do have:


<noscript><object id="peterflashobj" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="880" height="603">
<param name="movie" value="swf/work.swf">
<param name="quality" value="high">
<embed src="swf/work.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="880" height="603"></embed>
</object></noscript>

But that's inside the noscript tag, so isn't available to the script. Even if it were hard coded, the id is to the object tag. Firefox would use the embed tag.

I tried adding the id in your script that writes the Flash tag for javascript enabled browsers:


<script type="text/javascript">
AC_FL_RunContent('id', 'peterflashobj', 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','880','height','603','src','swf/work','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','swf/work' ); //end AC code
</script>

But it didn't add it. So I used name instead:


<script type="text/javascript">
AC_FL_RunContent('name', 'peterflashobj', 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','880','height','603','src','swf/work','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','swf/work' ); //end AC code
</script>

Which it did do, and which meant changing this:


animatedcollapse.ontoggle=function($, divobj, state){
if (divobj.id=="peter"){ //if "peter" DIV is being toggled
if (state=="block") //if div is expanded
document.getElementById('peterflashobj').play() //play movie
else
document.getElementById('peterflashobj').stop() //stop movie
}
}

to:


animatedcollapse.ontoggle=function($, divobj, state){
if (divobj.id=="peter"){ //if "peter" DIV is being toggled
if (state=="block") //if div is expanded
document.getElementsByName('peterflashobj')[0].play() //play movie
else
document.getElementsByName('peterflashobj')[0].stop() //stop movie
}
}

That fixed the error, and made a new one:


An error exists inside your "ontoggle" function:

TypeError: document.getElementsByName("peterflashobj")[0].play is not a function

Aborting execution of function.

This means that you have no javascript control over the Flash object, at least not via the .play() and .stop() functions.

You might be able to gain this control by updating AC_RunActiveContent to swfobject:

http://code.google.com/p/swfobject/

and using its JavaScript API. I say might, because in Flash plugin versions later than 6, there (at least it is my understanding that there) are some limitations to the Google API.