Results 1 to 3 of 3

Thread: Animated Collapse - errors before full page load

  1. #1
    Join Date
    Apr 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Animated Collapse - errors before full page load

    1) Script Title: Animated Collapse

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...edcollapse.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!

  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    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:
    Code:
    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)
    		}
    	}
    },
    DD Admin

  3. #3
    Join Date
    Apr 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for your help, that's great!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •