php + javascript help

hey /g/ i have a question about web coding.
im using php and javascript to output a grid of thumbnails which when clicked upon will load a larger version of the image in another part of the page. the thumbnail load, i can get an image to change, but for some reason the thumbnails wont load the larger image. here's the code i have:

<SCRIPT LANGUAGE ="JavaScript">
function clicky(f)
{
active.src=("images/environments/"+f);
}
</SCRIPT>

<?php
$i=0;
$filenames=scandir("images/environments");//puts filenames into an array
foreach($filenames as $file)//somehow goes through the array and...
{
if(!($file == '.' or $file == '..'))
{
if($i==2)
{
echo '<br>';
$i=0;
}
echo '<img src="images/thumbs/t'.$file.'" onclick="clicky('.$file.')">';
$i++;
}
}
?>

and later in the page, the large image that should change:

<img name="active" src ="images/environments/Giraffetapus.jpg">

any idea what the heck is wrong with it?
basically, im tying to figure out why, when i click on the thumbnails, the image dosent change. i think its in either the cilcky() function or the onclick event