cannot get thickbox to open / tb_show function ignored 2nd attempt

Question

I have two links that should open up thickbox's in iframes but only one works (the one with the id of product_photo_zoom_url2). I have the following jquery code that works when this code (in first code box) s removed from the markup. This code loads a picture zoom function. See complete markup below. All that happens when the first zoom image is clicked is the page goes to the top so it seems that the .click bind is being ignored? How do I get this to work?

Here is a link to a sample page... When you hover over the product picture the zoom works but if you click on the picture it seems to follow the href"#" rather than the click bind. If I disable the zoom feature then all works fine. So why is the zoom messing up the click bind and what can I do to fix it so both Thickbox and the zoom work together.

sample page

onload="vZoom.add(this, '/v/vspfiles/photos/70367301P-2.jpg');" /

jquery code..

var titleattr = $("a#product_photo_zoom_url").attr("title"); 
function picurl()
{
tb_show(titleattr, '/PhotoDetails.asp?ShowDESC=N&ProductCode='+ global_URL_Encode_Current_ProductCode + '&TB_iframe=true&height=600&width=520');return false;
} 
$("a#product_photo_zoom_url").click(picurl);
$("a#product_photo_zoom_url2").click(picurl);
$("a#product_photo_zoom_url").attr('href', '#');
$("a#product_photo_zoom_url2").attr('href', '#');

Here is the html code...

<a id="product_photo_zoom_url" href="/PhotoGallery.asp?ProductCode=70367301P"
title="70367301P Ignition Box">
<img id="product_photo" src="/v/vspfiles/photos/70367301P-2T.jpg"
border="0" alt="70367301P Ignition Box" onload="vZoom.add(this, '/v/vspfiles/photos   /70367301P-2.jpg');" /></a>
<a id="product_photo_zoom_url2" href="/PhotoGallery.asp?ProductCode=70367301P"    title="70367301P Ignition Box">

Answer 1

I assume you know that Firefox + Firebug are your best friends for debugging JS problems. If not, get thee to the addons.mozilla.org website pronto!