SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    Non-Member spdrcr's Avatar
    Join Date
    Sep 2000
    Location
    Oklahoma City, OK
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I am making a site and i wanted to have it so that whenever you open a page a different image is shown in the corner of the page. I checked a couple of sites, and couldn't find the code. Can anyone help me here?

    SR

  2. #2
    imagine no limitations exbabylon's Avatar
    Join Date
    Dec 2000
    Location
    Idaho, USA
    Posts
    452
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    can you use PHP or perl? Then it would work cross browser.
    Blamestorming: Sitting around in a group discussing why a deadline was missed or a project failed and who was responsible.

    Exbabylon- Professional Internet Services

  3. #3
    Non-Member spdrcr's Avatar
    Join Date
    Sep 2000
    Location
    Oklahoma City, OK
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah im pretty sure i could use perl...

    its virtualave.net if that helps any. well thats the server im on

  4. #4
    SitePoint Enthusiast spleenboy's Avatar
    Join Date
    Nov 2000
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I hope this will help. Here's a quick randomizer in JS . . . (although Perl would be nice)

    Code:
    function randomPicture() {
    	if (document.images) {
    		var num = Math.round(Math.random() * 10);
    		document.rndimage.src="random" + num + ".jpg";
    	}
    }
    Then put an image into your document and insert "name='rndimage'" into the tag. Use onLoad="randomPicture()" in the body tag. Oh, and name all of the images you want to use (jpg only) with "random" and then a number. The script right now is set up for 10 pictures.
    s-p-l-e-e-n-d-i-f-e-r-o-u-s

  5. #5
    Non-Member spdrcr's Avatar
    Join Date
    Sep 2000
    Location
    Oklahoma City, OK
    Posts
    214
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    did you leave some code out?

    it doesnt seem to work...and you don't have to do a preloader with the images right?

    SR

  6. #6
    SitePoint Addict isuru's Avatar
    Join Date
    Nov 2000
    Posts
    206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have a look at the Javascript primer at http://www.htmlgoodies.com

    There is a section on generating random images

  7. #7
    Non-Member JAMJAMMO's Avatar
    Join Date
    Dec 2000
    Posts
    106
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    here ya go, i found this on some site and it works great. it is a two part script. HEAD & BODY. it originally was a random quote script which i love, but you can use it to randomly display images (either GIF or JPEG format), or text.

    This part goes into the head tag, its the image preloader:
    [code]
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    image1 = new Image();
    image1.src = "images/001.gif";
    image2 = new Image();
    image2.src = "images/002.gif";
    image3 = new Image();
    image3.src = "images/003.gif";
    image4 = new Image();
    image4.src = "images/004.gif";
    image5 = new Image();
    image5.src = "images/005.gif";
    image6 = new Image();
    image6.src = "images/006.gif";
    image7 = new Image();
    image7.src = "images/007.gif";
    image8 = new Image();
    image8.src = "images/008.gif";
    image9 = new Image();
    image9.src = "images/009.gif";
    image10 = new Image();
    image10.src = "images/010.gif";
    // End -->
    </script>
    [\code]

    And this is the script itself, pre configured for 10 images.
    [code]
    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    var howMany = 9
    var quote = new Array(howMany+1)
    quote[0]="<img src=images/001.gif>001"
    quote[1]="<img src=images/002.gif>002"
    quote[2]="<img src=images/003.gif>003"
    quote[3]="<img src=images/004.gif>004"
    quote[4]="<img src=images/005.gif>005"
    quote[5]="<img src=images/006.gif>006"
    quote[6]="<img src=images/007.gif>007"
    quote[7]="<img src=images/008.gif>008"
    quote[8]="<img src=images/009.gif>009"
    quote[9]="<img src=images/010.gif>010"
    function rndnumber(){
    var randscript = -1
    while (randscript < 0 || randscript > howMany || isNaN(randscript)){
    randscript = parseInt(Math.random()*(howMany+1))
    }
    return randscript
    }
    quo = rndnumber()
    quox = quote[quo]
    document.write(quox)
    // End -->
    </SCRIPT>
    [\code]

    When you have it installed, could you post the link here? I'd love to see how you impliment it into your site.

  8. #8
    SitePoint Enthusiast spleenboy's Avatar
    Join Date
    Nov 2000
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry about the bad description on that randomizer. Nope, there isn't a preloader with the script I gave. JamJammo's script looks good, use it if you want.

    But here's an example page using that script I showed you earlier (with a little modification, so you can include images with any name.) You might want to use an image preloader with this, but I think it would slow down the page, rather than speeding it up. It's pointless to preload all those images to the cache when you'd only be ever using one of them on the page:

    Code:
    <html>
    <head>
    <title>Random Pictures</title>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    //replace the letters with the names of your .jpg images
    var imgarray = new Array("A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z");
    
    function randomPicture() {
    	if (document.images) {
    		var num = Math.round(Math.random() * imgarray.length);
    		document.randimg.src="images/" + imgarray[num] + ".jpg";
    	}
    }
    
    
    //-->
    </SCRIPT>
    </head>
    
    <body onLoad="randomPicture()">
    <img name="randimg">
    </body>
    </html>
    Hope that makes it more clear!

    spleen
    s-p-l-e-e-n-d-i-f-e-r-o-u-s


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
  •