sliding a div horizontal

Hello, I have a div that when I do onmouseover an image, it moves left or right.
When it arrives to left position, it stops, but I dont know how to do to stop my div when its moving to the right and this div is finished. What can I do?
Thanks a lot.

Jordi.

This is the javascript that I have:

<SCRIPT LANGUAGE="JavaScript">

function verScroll(dir, spd, loop) {
loop = true;
direction = "right";
speed = 10;
scrolltimer = null;
if (document.layers) {
var page = eval(document.contentLayer);
}
else {
if (document.getElementById) {
var page= eval("document.getElementById('contentLayer').style");
}
else {
if (document.all) {
var page = eval(document.all.contentLayer.style);
      }
   }
}
direction = dir;
speed = parseInt(spd);
var x_pos = parseInt(page.left);
      if (loop == true) {
            if (direction == "left") {
            page.left = (x_pos - (speed));
            } else {
                  if (direction == "right" && x_pos < 123) {
                  page.left = (x_pos + (speed));
                  } else {
                  
                  page.left = 123;
                  
                  }
      }
scrolltimer = setTimeout("verScroll(direction,speed)", 1);
   }
}
function stopScroll() {
loop = false;
clearTimeout(scrolltimer);
}
//  End -->
</script>
jbadiaAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

amit_gCommented:
Please provide a working sample including HTML. This function has errors and will not work.
jbadiaAuthor Commented:
ok, here you are:

thanks a lot.

<?php require_once('Connections/uklook.php');
include "Connections/session.php";
include "Connections/newsession.php"; ?>
<?php
mysql_select_db($database_uklook, $uklook);
$query_Recordset1 = "SELECT * FROM marca";
$Recordset1 = mysql_query($query_Recordset1, $uklook) or die(mysql_error());
$row_Recordset1 = mysql_fetch_assoc($Recordset1);

?>
<head>
<title>titulo</title>

<script type="text/JavaScript">
var lastObj=null;
function swapImage(obj,strSrc)
{
    if(!obj.getAttribute("src2"))obj.setAttribute("src2",obj.src);
    obj.src=strSrc;
    obj.onclick=function()
    {
           if(lastObj && lastObj!=this)
           {
                lastObj.onmouseout=new Function("swapImgRestore(this)");
                swapImgRestore(lastObj);
           }
           this.onmouseout=null;
           lastObj=this;
    }
}
function swapImgRestore(obj)
{
     obj.src=obj.getAttribute("src2");
}
</script>
<SCRIPT LANGUAGE="JavaScript">

function verScroll(dir, spd, loop) {
loop = true;
direction = "right";
speed = 10;
scrolltimer = null;
if (document.layers) {
var page = eval(document.contentLayer);
}
else {
if (document.getElementById) {
var page= eval("document.getElementById('contentLayer').style");
}
else {
if (document.all) {
var page = eval(document.all.contentLayer.style);
      }
   }
}
direction = dir;
speed = parseInt(spd);
var x_pos = parseInt(page.left);
      if (loop == true) {
            if (direction == "left") {
            page.left = (x_pos - (speed));
            } else {
                  if (direction == "right" && x_pos < 123) {
                  page.left = (x_pos + (speed));
                  } else {
                  
                  page.left = 123;
                  
                  }
      }
scrolltimer = setTimeout("verScroll(direction,speed)", 1);
   }
}
function stopScroll() {
loop = false;
clearTimeout(scrolltimer);
}
//  End -->
</script>

</head>

<body>
<div id="Layer1">
  <table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td height="1" bgcolor="#D81F2A"></td>
    </tr>
  </table>
</div>
<div id="Layer2">
  <table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td height="1" bgcolor="#D81F2A"></td>
    </tr>
  </table>
</div>
<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="252" height="89"><div align="left"><img src="images/logo.gif" width="240" height="89"></div></td>
            <td width="40">&nbsp;</td>
            <td width="527"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="532" height="89" align="right">
                <param name="movie" value="swf/menu%20800x600.swf">
                <param name="quality" value="high">
                <embed src="swf/menu%20800x600.swf" width="532" height="89" align="right" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
            </object></td>
          </tr>
</table>

<div id="contentLayer" style="position:absolute; width:300px; z-index:1; left: 123px; top: 91px">
<table width="" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="1" bgcolor="#D81F2A"></td>
  </tr>
</table>
  <table width="100%"  border="0" cellspacing="0" cellpadding="0">
    <tr>
      <th scope="row"><table height="80" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <?php $i =1;
      do { ?>
            <td valign="top" onMouseOver="turnOn('home<?php echo $i; ?>');" onMouseOut="turnOff('home<?php echo $i; ?>');"><div align="center">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                    <td height="1" valign="top"><div align="center"><img src="imatges/fletxaOff.gif" name="home<?php echo $i; ?>" width="15" height="11" class="imgTrans" id="home<?php echo $i; ?>"/></div></td>
                  </tr>
                  <tr>
                    <td height="1" bgcolor="#D81F2A"></td>
                  </tr>
                </table>
              <a href="mig.php?marca=<?php echo $row_Recordset1['marca_id']; ?>" target="mig"></a>
              <table width="100%" height="55" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td valign="middle"><a href="mig.php?marca=<?php echo $row_Recordset1['marca_id']; ?>" target="mig"><img src="imatges/separador.gif" width="5" height="11" border="0" /></a><a href="mig.php?marca=<?php echo $row_Recordset1['marca_id']; ?>" target="mig"><img src="imatges/<?php echo $row_Recordset1['marca']; ?>"  alt="<?php echo $row_Recordset1['marcaOver']; ?>" name="Image1" border="0" id="Image1" onMouseOver="swapImage(this, 'imatges/<?php echo $row_Recordset1['marcaOver']; ?>')" onMouseOut="swapImgRestore(this)" /><img src="imatges/separador.gif" width="5" height="11" border="0" /></a></td>
                </tr>
              </table>
              </div></td>
            <?php $i++; } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
          </tr>

      </table></th>
    </tr>
  </table>
</div>
<div id="content" style="position:absolute; width:208px; z-index:3; left: -86px; top: 90px; height: 83px;">
  <table width="100%" height="100%"  border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
    <tr>
      <th bgcolor="#FFFFFF" scope="row"><div align="right"><a href="#" class="Estilo1" onMouseOver="verScroll('left','1','true')" onMouseOut="stopScroll()"><img src="imatges/fletxa-izq.gif" width="14" height="20" border="0" /></a></div></th>
    </tr>
  </table>
</div>
<div id="layer" style="position:absolute; width:208px; z-index:3; left: 892px; top: 90px; height: 84px;">
  <table width="100%" height="100%"  border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
    <tr>
      <th bgcolor="#FFFFFF" scope="row"><div align="left"><span class="Estilo1"><a href="#" onMouseOver="verScroll('right','1','true')" onMouseOut="stopScroll()"><img src="imatges/fletxa-dreta.gif" width="14" height="20" border="0" /></a></span></div></th>
    </tr>
  </table>
</div>
</body>
</html>
brunoCommented:
please provide the generated source code, the source from View Source in the browser without the PHP.
amit_gCommented:
Change

          if (direction == "left") {
          page.left = (x_pos - (speed));
          } else {

to

          if (direction == "left") {
          page.left = (x_pos - (speed));
          if (x_pos <= 0) return;
          } else {

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
jbadiaAuthor Commented:
NICE JOB, THANK YOU VERY MUCH. IT GOES RIGHT.

JORDI
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Languages and Standards

From novice to tech pro — start learning today.