Gap in Layout when using PHP

[eday_2010]

When I started redesigning my site, I decided that I wanted the picture at the top to randomly rotate through a set of images in a specific folder. Once I got the dimensions right with a placer image, I popped in the script and got it going.

The problem is that when I put the script in to do the rotating, there is a gap between the bottom of the image and the top of the rest of the layout. When I take the script away and just have one static image, there is no gap, which is how it should be.



Here is how it's supposed to look:

The source code is simple:

<tr>
<td valign="top" colspan="3"><img src="content/includes/layout/random/33.jpg" alt=" " width="627" height="164" /></td>
</tr>

And here is how it looks when I use the Javascript/PHP random image rotator:

Source Code:

<?php
$path_to_images = "content/includes/layout/random/";
$num_to_rotate = "ALL";

// returns string to echo into JavaScript images array
function getJSRandomized($path, $list, $num) {
$str = '"';
mt_srand( (double)microtime() * 1000000 );
shuffle($list);
if ( $num == "ALL" ) $num = count($list);
for ($i=0; $i<$num; $i++) {
$str .= $path . $list[$i] . '", "';
}
// remove last comma and space
$str = substr($str, 0, -3);
return $str;
}
function getImagesList($path) {
$ctr = 0;
if ( $img_dir = @opendir($path) ) {
while ( false !== ($img_file = readdir($img_dir)) ) {
// add checks for other image file types here, if you like
if ( preg_match("/(\.gif|\.jpg)$/", $img_file) ) {
$images[$ctr] = $img_file;
$ctr++;
}
}
closedir($img_dir);
return $images;
} else {
return false;
}
}
?>
<?php if ( $image_list = getImagesList($path_to_images) ) : ?>

<script type="text/javascript">
/*************************************************************************
This code is from Dynamic Web Coding at dyn-web.com
Copyright 2001-5 by Sharon Paine
See Terms of Use at dyn-web.com/bus/terms.html
regarding conditions under which you may use this code.
This notice must be retained in the code as is!

See full source code at dyn-web.com/scripts/rotate-rand/
*************************************************************************/
var imgList = [
<?php echo getJSRandomized($path_to_images, $image_list, $num_to_rotate); ?>
];
var rotator1 = new dw_RandRotator(10000); // rotation speed
// images array, width and height of images, transition filter (boolean)
rotator1.setUpImage(imgList, 627, 162, true);
</script>

<?php else : ?>
<!-- image to display if directory listing fails -->
<img src="images/smile.gif" width="625" height="122" alt="">

<script type="text/javascript">dw_Rotator.start = function() {};</script>

<?php endif; ?>

Does anyone know why using PHP causes a gap in the layout like this? It's terribly annoting.

[blm126]

PHP does not cause the gap. Something in you generated code is different that the original code. We need to see a demo page(not a picture) with plain HTML and one with the PHP in it.

[eday_2010]

Nevermind, I found a better script right here on Dynamic Drive that uses no PHP. And alas, the gap is gone.