Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3

Thread: random images

  1. #1
    New Coder
    Join Date
    Jul 2005
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    random images

    okay this should be quite simple but I'm already confused. Is there a way to put all necessary pictures in a folder and then place an image to html and when the image is clicked it would open random image from the folder. So I could easily add images afterwards?

  • #2
    Senior Coder JamieR's Avatar
    Join Date
    Oct 2004
    Location
    United Kingdom
    Posts
    3,161
    Thanks
    0
    Thanked 5 Times in 5 Posts
    You can use either javascript or PHP to call in the images and display them randomally. If you want to use PHP, you'd have to use the mt_rand() function

  • #3
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    If you want it to where the image changes when the user clicks the image then you would need to use javascript using an array to store the images like so and call them randomly onclick.
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    <script type="text/javascript">
    <!--
    var theImages = new Array()
    theImages[0] = '100.jpg'
    theImages[1] = '200.jpg'
    theImages[2] = '300.jpg'
    theImages[3] = '400.jpg'
    
    var j = 0
    var p = theImages.length;
    var preBuffer = new Array()
    for (i = 0; i < p; i++){
       preBuffer[i] = new Image()
       preBuffer[i].src = theImages[i]
    }
    function showImage(){
    var whichImage = Math.round(Math.random()*(p-1));
    document.getElementById('theimage').src=theImages[whichImage];
    }
    
    //-->
    </script>
    </head>
    
    <body>
    <img src="100.jpg" onclick="showImage()" id="theimage" alt="">
    </body>
    </html>
    If you want it to where onload it displays a random image then I would use php. Here is an example that reads the images from a directory and picks a random image to display.


  •  

    Posting Permissions

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