开发者

random image and its url

开发者 https://www.devze.com 2023-01-31 19:43 出处:网络
i want to create a random image and its url, i me开发者_开发技巧an not the link of the image, but in addition to image\'s link, i want the specified URL, so that random image was displayed and when u

i want to create a random image and its url, i me开发者_开发技巧an not the link of the image, but in addition to image's link, i want the specified URL, so that random image was displayed and when u click on it, u go to the specified URL

here is my javascript:

    function random_imglink(){
      var myimages=new Array()
      //specify random images below. You can have as many as you wish
      myimages[1]="/documents/templates/projedepo/banner/canon.jpg"
      myimages[2]="/documents/templates/projedepo/banner/indigovision.jpg"

      var ry=Math.floor(Math.random()*myimages.length)

      if (ry==0)
         ry=1

    var randomImage = '<img src="'+myimages[ry]+'" height="420" width="964" />';
    document.getElementById("image2").innerHTML = randomImage;
    }
    random_imglink()

Here is my HTML:

<div id="slider_container">    
<div id="image2">
</div>
<div id="thumb2">
<a href="#" rel="/documents/templates/projedepo/banner/canon.jpg" class="image2" ><img title="Canon" class="slider_thumb" src="/documents/templates/bilgiteknolojileri/images/t_flash/t1.png" border="0"/></a>
<a href="#" rel="/documents/templates/projedepo/banner/indigovision.jpg" class="image2"><img title="IndogoVision" class="slider_thumb" src="/documents/templates/bilgiteknolojileri/images/t_flash/t2.png" border="0"/></a>
</div></div>


I'm not entirely sure what you want to do, but I think you want to create a single image which links to an url, chosen at random from a list of images and corresponding urls. You could do it like this:

function random_imglink() {
    var myimages = [
        {image: "/documents/templates/projedepo/banner/canon.jpg", url: "http://www.url1.com"},
        {image: "/documents/templates/projedepo/banner/indigovision.jpg", url: "http://www.url2.com"}
    ];

    var ry=Math.floor(Math.random()*myimages.length);

    var randomImage = myimages[ry];

    var randomImageLink = '<a href="' + randomImage.url + '"><img src="'+randomImage.image+'" height="420" width="964" /></a>';
    document.getElementById("image2").innerHTML = randomImageLink;
}

I'm using [] here to create an array, which starts at index 0 (see: http://www.hunlock.com/blogs/Mastering_Javascript_Arrays). Because of this, you don't need the if (ry == 0) ry = 1; part. The things in {} are javascript objects, which you can use as associative (key-value) arrays. See also http://www.quirksmode.org/js/associative.html.

Maybe you already know all of this, in which case please disregard everything I said :)

EDIT:

By the way, if you want to do this a little bit nicer and there will always be an image and a link in your image2 div, you could put all the non-dynamic stuff in the html:

<div id="image2">
    <a id="image2-link" href="#"><img id="image2-image" src="" height="420" width="964" /></a>
</div>

and then

(...)

    var randomImage = myimages[ry];

    document.getElementById("image2-link").href = randomImage.url;
    document.getElementById("image2-image").src = randomImage.image;
0

精彩评论

暂无评论...
验证码 换一张
取 消