Image Thumbnail Viewer II: Way to Prevent linking to actual image URL's?

[ccesca]

1) Script Title: Image Thumbnail Viewer II

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/thumbnail2.htm

3) Describe problem:

Is there a way to prevent a hard-link (not sure what the best term would be) from happening when a user clicks on an image that uses the hover action to change the main image?

My code looks like this:




<div id="loadarea">
<img src="productimages/image1.jpg"/>
</div>

<div id="productThumbs">
<a href="productimages/image1.jpg" rel="enlargeimage" rev="targetdiv:loadarea"><img src="productimages/image1.jpg"/></a>
<a href="productimages/image2.jpg" rel="enlargeimage" rev="targetdiv:loadarea"><img src="productimages/image2.jpg"/></a>
<a href="productimages/image3.jpg" rel="enlargeimage" rev="targetdiv:loadarea"><img src="productimages/image3.jpg"/></a>
</div>



And all works as it should, meaning the main image changes when the user hovers over the thumbs, but i would prefer it if they couldn't also click the image, which takes them to the actual image URL....

Is there a way to prevent this, either by tweaking the HTML here, or changing a setting in the javascript or css?

Thanks in advance of any help :)

[jscheuer1]

Put this in the head of the page after the scripts for the viewer:


<script type="text/javascript">
jQuery(function($){
$('a[rel="enlargeimage"]').click(function(e){
e.preventDefault()
});
});
</script>

The browser cache may need to be cleared and/or the page refreshed to see changes.