SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Enthusiast
    Join Date
    Jun 2003
    Location
    Lake Villa, IL
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Random entrance images?

    How can I make it so random, different entrance pictures?

    An example is: www.thedistillers.com (click refresh a couple times and you'll see what I mean)

    Thanks for any help

    - Andre

  2. #2
    Non-Member Frozentoast's Avatar
    Join Date
    Apr 2002
    Location
    Manchester, UK
    Posts
    4,758
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    This is PHP

    PHP Code:
    <?php
    /*
    ****Made by FrozenToast <uncle_nob_ead@hotmail.com>
    */

    // customize this
    $images 'splash1.gif,splash2.jpg,me.jpg';

    // dont customize these
    $images explode(','$images);

    $image $images[rand(0count($images)-1)];

    print 
    "<img src='$image' alt='splash' />";
    ?>
    Hope this helps

  3. #3
    SitePoint Zealot
    Join Date
    Jan 2003
    Posts
    169
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Or in JavaScript if your server doesn't support PHP
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    // Set up the image files to be used.
    var theImages = new Array() // do not change this
    // To add more image files, continue with the
    // pattern below, adding to the array.
    theImages[0] = 'picture1.jpg'
    theImages[1] = 'picture2.jpg'
    theImages[2] = 'picture3.jpg'
    theImages[3] = 'picture4.jpg'
    // do not edit anything below this line
    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]
    }
    var whichImage = Math.round(Math.random()*(p-1));
    function showImage(){
    document.write('<img src="'+theImages[whichImage]+'">');
    }
    //  End -->
    </script>
    </HEAD>
     
     
    <BODY>
    
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    showImage();
    //  End -->
    </script>
    
    </BODY>
    </HTML>

  4. #4
    SitePoint Enthusiast stationmaster's Avatar
    Join Date
    May 2003
    Location
    barcelona
    Posts
    68
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I was just looking at the js solution for this and I do have a question,
    does the browser actually load all of the images in the array?
    The safari activity window says yes,
    and if it does that could be a problem with hogging bandwidth.
    Also, how could you write it so as it only loads one of the images and not all? Rather than loading all and displaying one.
    perhaps putting the js external might help..
    Daiv Mowbray twincascos Barcelona
    wordpress pluginswp-superslider.com
    portfolio portfolio.daivmowbray.com
    personal blogwww.daivmowbray.com

  5. #5
    SitePoint Enthusiast
    Join Date
    Jun 2003
    Location
    Lake Villa, IL
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Lind
    Or in JavaScript if your server doesn't support PHP
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    // Set up the image files to be used.
    var theImages = new Array() // do not change this
    // To add more image files, continue with the
    // pattern below, adding to the array.
    theImages[0] = 'picture1.jpg'
    theImages[1] = 'picture2.jpg'
    theImages[2] = 'picture3.jpg'
    theImages[3] = 'picture4.jpg'
    // do not edit anything below this line
    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]
    }
    var whichImage = Math.round(Math.random()*(p-1));
    function showImage(){
    document.write('<img src="'+theImages[whichImage]+'">');
    }
    //  End -->
    </script>
    </HEAD>
     
     
    <BODY>
    
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    showImage();
    //  End -->
    </script>
    
    </BODY>
    </HTML>

    Do you know if there's a way I could get this centered and add javascript to it? I need it to open in a smaller window when you click on the image. . .

    Thanks a bunch,

    - Andre

  6. #6
    SitePoint Guru puco's Avatar
    Join Date
    Feb 2005
    Location
    Slovakia
    Posts
    785
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by stationmaster
    I was just looking at the js solution for this and I do have a question,
    does the browser actually load all of the images in the array?
    The safari activity window says yes,
    and if it does that could be a problem with hogging bandwidth.
    Also, how could you write it so as it only loads one of the images and not all? Rather than loading all and displaying one.
    perhaps putting the js external might help..
    Yes it loads all images, if you create an instance of Image object it is loaded.

    Code:
       preBuffer[i] = new Image()
       preBuffer[i].src = theImages[i]
    You can remove the precaching, because it serves no purpose here.
    Martin Pernecky


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
  •