Animated Collapse - errors before full page load

[a575606]

1) Script Title: Animated Collapse

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

3) Describe problem: First of all thanks for the great script! It's a real time saver. I'm using it in a web application to show/hide extra details about available promotions we have at the moment.

The problem I have is that when I click on the toggle link and the page hasn't loaded completely I get a javascript error in both IE and firefox and the div doesn't expand. If I hit the stop button and try again, it all works fine again.

I'm running the code on a local testing site and so the page loads instantaneously, but sometimes my internet connection is slow and the reason the page takes extra time to load is it is tracking the page via google analytics.

The same thing happens when I load the example page on dynamic drive, so I don't think it's something I'm doing on my page.

Is there a fix for this? I would prefer not to show the links until they're ready to use.

Thanks for your help!

[ddadmin]

By default the script is properly initialized as soon as the document's DOM is ready to be manipulated, which for anyone on a non dial up connection should be virtually instantaneous (unless your page is super long). So the # of people affected by this is probably very small.

One quick change you can make to the script is to alert a message when the associated buttons are clicked on and the script has yet to initialize fully, instead of return a JavaScript error. Inside the .js file, you'd add the code in red below:


showhide:function(divid, action){
if (!this.divholders[divid].$divref){
alert("Please try again after page has loaded")
return false
}
var $divref=this.divholders[divid].$divref //reference collapsible DIV
if (this.divholders[divid] && $divref.length==1){ //if DIV exists
var targetgroup=this.divgroups[$divref.attr('groupname')] //find out which group DIV belongs to (if any)
if ($divref.attr('groupname') && targetgroup.count>1 && (action=="show" || action=="toggle" && $divref.css('display')=='none')){ //If current DIV belongs to a group
if (targetgroup.lastactivedivid && targetgroup.lastactivedivid!=divid) //if last active DIV is set
this.slideengine(targetgroup.lastactivedivid, 'hide') //hide last active DIV within group first
this.slideengine(divid, 'show')
targetgroup.lastactivedivid=divid //remember last active DIV
}
else{
this.slideengine(divid, action)
}
}
},

[a575606]

Thanks for your help, that's great!