dzhax Posted April 12, 2013 Share Posted April 12, 2013 Hello everyone! Working on animating my page with some jquery .animate and having some trouble. I have the following script to "collapse" a menu and load new content to the <td> however I am having difficulty expanding the <td> after the new content has completed loading. <script type="text/javascript"> function loadNav(received){ if(received.parentNode.className != "selected"){ $('#header').animate({height: "-=95px"}, { duration: 350,complete: function() { var elems = document.getElementsByTagName('*'), i; for (i in elems) { if((elems[i].className).indexOf('menu')> -1) { var child_span = elems[i].getElementsByTagName("td"); for(i=0;i<child_span.length;i++){ child_span[i].className=""; } child_span[0].className ="file"; received.parentNode.className="selected"; document.getElementById('menuBody').innerHTML = "<td colspan=10><div>"+received.innerText+"</div></td>"; expandMenu(); } } } }); } } function expandMenu(){ $('#header').animate({height: "+=95px"}, 'slow'); }</script> it works just fine collapsing the div but it will not open back up. Also I get the following error in the console Uncaught TypeError: Cannot call method 'indexOf' of undefined and its pointing to this line: if((elems[i].className).indexOf('menu')> -1) { However the first half of the animation is completing and the className's are updating like normal. Any help on this is much appreciated. Link to comment Share on other sites More sharing options...
justsomeguy Posted April 12, 2013 Share Posted April 12, 2013 Don't use for (i in elems) when you're working with arrays, for..in is for objects. It will return things like properties also, including the length property of arrays. So at one point i is set to length, so you're trying to get elems.length.className, which obviously doesn't exist. Use a regular for loop for arrays. Link to comment Share on other sites More sharing options...
dzhax Posted April 12, 2013 Author Share Posted April 12, 2013 (edited) thanks for that. I am now using for (i=0; i < elems.length; i++) { and the error is no longer showing in the console. however the div is still not expanding. Nevermind I fixed it. I added a break after calling expandMenu(); Edited April 12, 2013 by dzhax Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now