not 100% sure, but I think you can do it by using using the standard javascript rollover syntax.

Something like:

Code:
<script language="Javascript">



if (document.images) {
     thumb1 = new Image
     thumb2 = new Image

     thumb1.src = '{$tmburl}/1_{$recent[i].VID}.jpg'
     thumb2.src = '{$tmburl}/2_{$recent[i].VID}.jpg'
 }

</script>
Then call it within the IF statement:

Code:
<a href="{$baseurl}/view/{$recent[i].VID}/{$recent[i].seo_name}/"  onmouseover="document.rollover.src=thumb2.src" onmouseout="document.rollover.src=thumb1.src">
[img]{$tmburl}/1_{$recent[i].VID}.jpg[/img]

{$recent[i].title|truncate:30:"...":true}</a>
I don't really know if this is 100% working or not, but it should give you an idea of where to start. It's early and I'm tired.
I'll try to test it out later and post a tested code.