Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Jun 2007
    Posts
    3
    Member #
    15360
    Hello,

    I currently have a portion of javascript on my home page that rotates 4 images at about 8 seconds each. I would like to make these images clickable so that if someone clicks on the image, it would take them to their website. Is this possible, and if so how can it be done. The javascript I have is posted below. Thank you

    Code:
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    var interval = 2.5; // delay between rotating images (in seconds)
    var random_display = 0; // 0 = no, 1 = yes
    interval *= 3000;
    
    var image_index = 0;
    image_list = new Array();
    image_list[image_index++] = new imageItem("http://example.com/img/01.jpg");
    image_list[image_index++] = new imageItem("http://example.com/img/02.jpg");
    image_list[image_index++] = new imageItem("http://example.com/img/03.jpg");
    image_list[image_index++] = new imageItem("http://example.com/img/04.jpg"); 
    
    var number_of_image = image_list.length;
    
    function imageItem(image_location) 
      { this.image_item = new Image();
    	this.image_item.src = image_location;
      }
      
    function get_ImageItemLocation(imageObj) 
      { return(imageObj.image_item.src)
      }
      
    function generate(x, y) 
      { var range = y - x + 1;
        return Math.floor(Math.random() * range) + x;
      }
      
    function getNextImage() 
      { if (random_display) 
          { image_index = generate(0, number_of_image-1);
          }
        else 
    	 { image_index = (image_index+1) % number_of_image;
         }
        var new_image = get_ImageItemLocation(image_list[image_index]);
        return(new_image);
      }
      
    function getPrevImage() 
      { if (random_display) 
          { image_index = generate(0, number_of_image-1);
          }
        else 
    	 { if (image_index==0)
    	      { image_index = (number_of_image-1) % number_of_image;
    		  }
    	   else
    	      { image_index = (image_index-1) % number_of_image;
    		  }
         }
        var new_image = get_ImageItemLocation(image_list[image_index]);
        return(new_image);
      }
      
    function rotateImage(place) 
      { var new_image = getNextImage();
        document[place].src = new_image;
        var recur_call = "rotateImage('"+place+"')";
        setTimeout(recur_call, interval);
      }
      
    function rotateNextImage(place) 
      { var new_image = getNextImage();
        document[place].src = new_image;
        var recur_call = "rotateImage('"+place+"')";
        //setTimeout(recur_call, interval);
      }
      
    function rotatePrevImage(place) 
      { var new_image = getPrevImage();
        document[place].src = new_image;
        var recur_call = "rotateImage('"+place+"')";
        //setTimeout(recur_call, interval);
      }
    //  End -->
    </script>

  2.  

  3. #2
    Junior Member _shady's Avatar
    Join Date
    Mar 2007
    Location
    Atlanta, GA USA
    Posts
    20
    Member #
    14934
    Instead of setting the src of an <img> tag you could use a div and set the innerHTML of the div to a link with your image as the links content.

    Code:
     
    myDiv.innerHTML = "<a href='myimagelink1.html'><img src='image1.jpg'></a>"
    That way you'd be switching out links and not just images. Hope that helps!

  4. #3
    Junior Member
    Join Date
    Jun 2007
    Posts
    3
    Member #
    15360
    Thanks for the quick reply, but I think I'm still a bit lost


Remove Ads

Posting Permissions

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

Search tags for this page

clickable image rotator javascript

,

how do i create linkable rotating images

,

how do i make rotating images clickable

,

how to make an image clickable javascript code

,

html code rotating clickable image display

,

html to rotate clickable images

,

javascript image rotator with clickable link

,

json clickable image

Click on a term to search for related topics.
All times are GMT -6. The time now is 05:21 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com