Adding motion to the images

[riddhi]

I want to display the product images at the button of the page using the code as follows:-

 

<?php
require_once 'library/config.php';
if (!defined('WEB_ROOT')) {
exit;
}
?>
<p> </p>
<table width="100%" border="0" cellspacing="0" cellpadding="10">
<tr>
  <td align="center">
   <br />
<?
   $res=dbQuery("SELECT PD_ID,CAT_ID,PD_NAME,
             PD_THUMBNAIL,PD_DATE
		     FROM TBL_PRODUCT");

if(mysql_num_rows($res) == 0 ){ //None of the product Image found
	echo "<br><br><marquee bgcolor='red'>
	    <b>There is no Product in The Shop </b></marquee>"; 
	exit; // Quit The Script			 
     }

 while ($record=mysql_fetch_array($res)){
	if($record['PD_THUMBNAIL']){
	      $cat_image=$record['PD_THUMBNAIL'];
	        
	if($cat_image){
	    $cat_image = WEB_ROOT.'images/product/' . $cat_image; 
	 }// End If
   else 
	    $cat_image = WEB_ROOT.'images/no-image-small.png';
	}// End of Thumbnail IF
	echo "<img src='$cat_image' border='10'>"; 
     }// End While Loop			

?>
   
   </td>
</tr>
</table>
</body>
</html>

 

Now I want the image to move from left to right in a looping manner.

 

[play_]

Javascript

[riddhi]

would you please illustrate with code...

[zzman]

Javascript

xCo =-100;
function move(obj) 
{    
   	obj.style.left=xCo;
   	xCo +=2;
   	if(xCo < 100) {window.setTimeout("move(" +obj.id+ ");", 0);}
}

html

<p><img src="xx.gif" id="myImg" style="z-index: 0; left: -100px; position: absolute; top: 50px"></p>
<p> 
  <script language="JavaScript">
moveObjRight('myImg');
  </script>

</p>

[riddhi]

Thanks for taking pain to write the code however I have the following point:-

 

1> There is no motion noticed in the images displayed

 

2> I would like the pictures to appear row fashion instead of columnar fashion that it is showing now

 

Here is the code I wrote in PHP the transformed one:-

 

echo "<p><img src=$cat_image id='myImg' style='z-index: 0  left: -100px  position: absolute  top: 50px'></p>";
        echo "<p>"; 
        echo "<script language='JavaScript'>";
    echo "moveObjRight('myImg')";
	echo "xCo =-100";
        echo "function move(obj){";
	echo "obj.style.left=xCo";
   	    echo "xCo +=2";
   	    echo "if(xCo < 100) {window.setTimeout('move(' +obj.id+ ')', 0)}";
         echo "}";
         echo "</script> </p>";
     }// End While Loop			

[zzman]

I have tested the code it works ... The image should move from left to right. IF you want it to move up/down try to add the y coordinate to the code. 

[riddhi]

plaese help... I am using IE6

[MadTechie]

code seams fine

[riddhi]

nothing it is only displaying the images with no images. I want to display in the footer area of my online shop.

 

    Is my PHP Code fine too??

[riddhi]

will someone help me out.

[neel_basu]

What its still doing in PHP forum ?? Any body Please move it in Javascript forum!!

[riddhi]

Sorry, dude but I feel it is here because I want to verify the PHP Code that embeds javascript.

 

The error in the IE after html is generated by PHP is "object expected" at the line where <img> tag is there