Results 1 to 2 of 2

Thread: thumbnail viewer href to a seperate page

  1. #1
    Join Date
    May 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default thumbnail viewer href to a seperate page

    1) Script Title: Thumbnail Viewer 2

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...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

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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:

    Code:
    <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:

    Code:
    <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.
    Last edited by jscheuer1; 11-30-2010 at 10:55 AM. Reason: correct code, later add - "Tested and works . . . "
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •