www.webdeveloper.com
Results 1 to 2 of 2

Thread: I don't understand the moveElement() function read in the DOM Scripting book ?

  1. #1
    Join Date
    Nov 2012
    Posts
    5

    I don't understand the moveElement() function read in the DOM Scripting book ?

    Here's the code:
    HTML Code:
    function moveElement(elementID,final_x,final_y,interval) { 
      if (!document.getElementById) return false; 
      if (!document.getElementById(elementID)) return false; 
      var elem = document.getElementById(elementID);
      if (elem.movement) { 
        clearTimeout(elem.movement);
      } 
      if (!elem.style.left) {
        elem.style.left = "0px";
      } 
      if (!elem.style.top) {
        elem.style.top = "0px";
      } 
      var xpos = parseInt(elem.style.left); 
      var ypos = parseInt(elem.style.top); 
    
      if (xpos == final_x && ypos == final_y) {
        return true;
      } 
    
      if (xpos < final_x) {
        var dist = Math.ceil((final_x - xpos)/10); 
        xpos = xpos + dist;
      } 
    
      if (xpos > final_x) {
        var dist = Math.ceil((xpos - final_x)/10); 
        xpos = xpos - dist;
      } 
    
      if (ypos < final_y) {
       var dist = Math.ceil((final_y - ypos)/10); 
       ypos = ypos + dist;
      } 
    
      if (ypos > final_y) {
       var dist = Math.ceil((ypos - final_y)/10); 
       ypos = ypos - dist;
      } 
      elem.style.left = xpos + "px"; 
      elem.style.top = ypos + "px"; 
      var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")"; 
      elem.movement = setTimeout(repeat,interval);
    }
    Now, what I don't understand is this :
    HTML Code:
      var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")"; 
    Why are there so many plus signs?
    Thanks in advance.

  2. #2
    Join Date
    Oct 2010
    Location
    Versailles, France
    Posts
    1,268
    There are so many + sign to concatenate strings, like : "moveElement('" or "'," or ")", and values of different variables elementID, final_x, final_y and interval to ensure a new call of the function moveElement, after interval milliseconds.

    Without this device, arguments (local variables in the function) would no longer be valid when calling the function.

    An other method to solve this problem is to call an anonymous function which call the function with arguments. In this case the values of the arguments are contained in the definition of the function.

    Code:
      elem.movement = setTimeout(function(){moveElement(elementID,final_x,final_y,interval)},interval);
    Last edited by 007Julien; 11-24-2012 at 05:23 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles