well... after some more trial and error i finally get her working!! yay! thanks again for sharing this with everyone! here is my product_images.tpl for 4.0.18 if it can help anyone else....
Code:
{if $images ne ""}
{capture name=dialog}
<script language="JavaScript" type="text/javascript">
{section name=image loop=$images}
{if {$images[image].image_path}
Image{$images[image].imageid} = new Image();
Image{$images[image].imageid}.src = "{$images[image].image_path|replace:"server path to remove":""}";
{/if}
{/section}
</script>
<table width="100%">
<tr>
<td>
<table>
{section name=image loop=$images}
{if {$images[image].image_path neq ""}
<tr>
<td>
<a href="#" onmouseover="document.main_image.src=Image{$images[image].imageid}.src;">
{thumb file=`$images[image].image_path` longside="100" link="false" html="alt='`$product.product`' border='0'"}</a>
</td>
</tr>
{/if}
{/section}
</table>
</td>
<td>
<img src="{$images[0].image_path|replace:"server path to remove":""}" name="main_image" alt="{$product.product}" />
</td>
</tr>
</table>
{/capture}
{include file="dialog.tpl" content=$smarty.capture.dialog extra='width="100%"'}
{/if}