PDA

View Full Version : thumbnail viewer href to a seperate page



ROYW1000
11-30-2010, 08:41 AM
1) Script Title: Thumbnail Viewer 2

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

3) Describe problem:

Hi, I am using this script and its working well, however the href is calling the enlarged image and if clicked takes you to the page with the enlarged image.

What I would like to do is use the code for displaying the images but want the link to go to a seperate page on the website showing producty information and not the enlarged image.

I have had a little play with the code but not sure how I can achieve what I want.

Many thanks in advance.

Roy

jscheuer1
11-30-2010, 10:31 AM
From what you say I'm assuming you are activating the triggers onmouseover.

You haven't indicated whether the enlarged image is hyperlinked or not. For what you're after, it probably should be and probably should be to this "seperate page on the website showing producty information". To do so follow the guidance on the link option for the rev attribute as outlined on the demo page, example:


<a href="products/first.jpg" title="Great for the Home or Office!" rel="enlargeimage"
rev="targetdiv:loadarea,link:firstproducty.htm">Thumbnail</a>

Once you have that set up and working for the enlarged images, add this script to the head of the page:


<script type="text/javascript">
jQuery(function($){
$('a[rel=enlargeimage]').click(function(e){
var opts = {}, rev = this.rev.split(','), re = /:(?!\/\/)/;
for (var i = rev.length - 1; i > -1; --i){
rev[i] = rev[i].split(re);
opts[$.trim(rev[i][0])] = $.trim(rev[i][1]);
}
if(opts.link){
e.preventDefault();
location.href = opts.link;
}
});
});
</script>

Tested and works. Questions? Feel free to ask. If you want more help:

Please post a link to a page on your site that contains the problematic code so we can check it out.