User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 423,490 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 4,670 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 1312 | Replies: 6
Reply
Join Date: Mar 2008
Posts: 39
Reputation: rickya100 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
rickya100 rickya100 is offline Offline
Light Poster

Sliding div error. Can't solve this.

  #1  
Jun 4th, 2008
Hi, thanks for checking this out.

Ok so the problem is that I have the following code for trying to get a div to slide down from the top of my page.

The problem is that on clicking the button that activates the function I get an error.

The error is flagged at line number 23 as an Undefined Value.

the javascript is below

  1.  
  2. var timerlen = 5;
  3. var slideAniLen = 5000;
  4.  
  5. var timerID = new Array();
  6. var startTime = new Array();
  7. var obj = new Array();
  8. var endHeight = new Array();
  9. var moving = new Array();
  10. var dir = new Array();
  11.  
  12. function toggleSlide(objname){
  13. if(document.getElementById(objname).style.display == "none"){
  14. // div is hidden, so let's slide down
  15. if (objname == 'login'){
  16. document['objname'].src = "images/member_login_btn_go_up";
  17. }
  18. alert(objname);
  19. slideshow(objname);
  20.  
  21. }else{
  22. // div is not hidden, so slide up
  23. if (objname == 'login'){
  24. document['objname'].src = "images/member_login_btn_go_down";
  25. }
  26. slidehide(objname);
  27. }
  28. }
  29.  
  30. function slideshow(objname){
  31. if (moving[objname]){
  32. return;
  33. }
  34.  
  35. if (document.getElementById(objname).style.display != "none"){
  36. return;
  37. }
  38.  
  39. moving[objname] = true;
  40. dir[objname] = "down";
  41. startslide(objname);
  42. }
  43.  
  44. function slidehide(objname){
  45. if ( moving[objname]){
  46. return;
  47. }
  48.  
  49. if (document.getElementById(objname).style.display == "none"){
  50. return;
  51. }
  52.  
  53. moving[objname] = true;
  54. dir[objname] = "up";
  55. startslide(objname);
  56. }
  57.  
  58. function startslide(objname){
  59. obj[objname] = document.getElementById(objname);
  60.  
  61. endHeight[objname] = parseInt(obj[objname].style.height);
  62. startTime[objname] = (new Date()).getTime();
  63.  
  64. if (dir[objname] == "down"){
  65. obj[objname].style.height = "1px";
  66. }
  67.  
  68. obj[objname].style.display = "block";
  69.  
  70. timerID[objname] = setInterval('slidetick(" + objname + ");',timerlen);
  71. }
  72.  
  73.  
  74. function slidetick(objname){
  75. var elapsed = new Date().getTime() - startTime[objname];
  76.  
  77. if (elapsed > slideAniLen){
  78. endSlide(objname);
  79. }
  80. else {
  81. var d = Math.round(elapsed / slideAniLen * endHeight[objname]);
  82. if(dir[objname] == "up"){
  83. d = endHeight[objname] - d;
  84. }
  85. obj[objname].style.height = d + "px";
  86. }
  87. return;
  88. }
  89.  
  90. function endSlide(objname){
  91. clearInterval(timerID[objname]);
  92.  
  93. if (dir[objname] == "up")
  94. obj[objname].style.display = "none";
  95.  
  96. obj[objname].style.height = endHeight[objname] + "px";
  97.  
  98. delete(moving[objname]);
  99. delete(timerID[objname]);
  100. delete(startTime[objname]);
  101. delete(endHeight[objname]);
  102. delete(obj[objname]);
  103. delete(dir[objname]);
  104.  
  105. return;
  106.  
  107. }
  108.  

The code is from here:

http://www.harrymaugans.com/2007/03/...cript-and-css/

And here:

http://www.harrymaugans.com/2007/03/...-animated-div/

I can't see a solution in the comments on the page anywhere.


Thanks for any help you can give.
Last edited by rickya100 : Jun 4th, 2008 at 7:32 pm. Reason: code syntax
AddThis Social Bookmark Button
Reply With Quote  
Join Date: Mar 2008
Posts: 39
Reputation: rickya100 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
rickya100 rickya100 is offline Offline
Light Poster

Re: Sliding div error. Can't solve this.

  #2  
Jun 4th, 2008
OK so the error above is no longer happening but an error that keeps replicating s now happening and it eventually crashes the browser.

It's on line 77 and it says "Type Error, Undefined Value"

An example of the site is online at www.mctc.co.uk
Last edited by rickya100 : Jun 4th, 2008 at 9:18 pm. Reason: Added web address
Reply With Quote  
Join Date: Jan 2007
Posts: 2,556
Reputation: MidiMagic is on a distinguished road 
Rep Power: 7
Solved Threads: 114
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Posting Maven

Re: Sliding div error. Can't solve this.

  #3  
Jun 10th, 2008
You can't call a function that is below the function you call it from. Move endSlide up above slidetick.
Daylight-saving time uses more gasoline
Reply With Quote  
Join Date: Mar 2008
Posts: 39
Reputation: rickya100 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
rickya100 rickya100 is offline Offline
Light Poster

Re: Sliding div error. Can't solve this.

  #4  
Jun 10th, 2008
Originally Posted by MidiMagic View Post
You can't call a function that is below the function you call it from. Move endSlide up above slidetick.


Hi MidiMagic,

Thanks for the reply. I did as you said and now I get an error of "Undefined Error" in FireFox's control panel. It again keeps replicating without stopping until I close the page.

It flags the following line in slideTick as the problem:

  1.  
  2. obj[objname].style.height = d + "px";
  3.  

Any thoughts on this?
Reply With Quote  
Join Date: Mar 2008
Posts: 39
Reputation: rickya100 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
rickya100 rickya100 is offline Offline
Light Poster

Re: Sliding div error. Can't solve this.

  #5  
Jun 10th, 2008
Just posting to say I sorted it out.

Apparently the script needs that style settings for the div tag to be inline and not held in an external CSS file.

If anyone knows why this would be I'd love to hear as it sorta makes maintaining the site a bit harder and cumbersome.
Reply With Quote  
Join Date: Jan 2007
Posts: 2,556
Reputation: MidiMagic is on a distinguished road 
Rep Power: 7
Solved Threads: 114
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Posting Maven

Re: Sliding div error. Can't solve this.

  #6  
Jun 14th, 2008
This depends on what is in the object module at the time the script loads. Scripts can not see dynamic changes made to web pages, unless the script is keeping track of the changes it makes itself.

Whether a script can see the style depends on when the script starts.
Daylight-saving time uses more gasoline
Reply With Quote  
Join Date: Mar 2008
Posts: 39
Reputation: rickya100 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
rickya100 rickya100 is offline Offline
Light Poster

Re: Sliding div error. Can't solve this.

  #7  
Jun 14th, 2008
Originally Posted by MidiMagic View Post
This depends on what is in the object module at the time the script loads. Scripts can not see dynamic changes made to web pages, unless the script is keeping track of the changes it makes itself.

Whether a script can see the style depends on when the script starts.


Sorry, I don't quite understand what you're saying.

Could you try and explain it again please. I'm not very experienced in JavaScript but I do a few other languages PHP etc so I'm comfortable with all the concepts. It's just the specific rules and syntax of JavaScript I stumble over sometimes.

Thank you.
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.

DaniWeb JavaScript / DHTML / AJAX Marketplace
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

Thread Tools Display Modes

Other Threads in the JavaScript / DHTML / AJAX Forum

All times are GMT -4. The time now is 4:00 pm.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC