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 6 of 6
  1. #1
    New Coder
    Join Date
    Oct 2010
    Posts
    37
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Help, should be easy

    hey guys im trying to make something that selects two different images but it keeps selecting two images that are the same, and dont know how to go about it to make it select two different. please help

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/javascript; charset=utf-8" />
    <title>Untitled Document</title>
    <script language="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]
    }
    
    var whichImage = Math.round(Math.random()*(p-1));
    function showImage(){
    document.write('<img src="'+theImages[whichImage]+'">');
    }
    
    //-->
    </script>
    
    
    </head>
    
    <body>
    
    
    
    <div align="center"></div>
    <table width="996" height="511" border="1">
      <tr>
        <th scope="col"><script language="JavaScript">
    <!--
    
    showImage();
    //-->
    </script>
        &nbsp; or
        <script language="JavaScript">
    <!--
    
    showImage();
    //-->
    </script> </th>
      </tr>
    </table>
    </body>
    </html>

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,084
    Thanks
    80
    Thanked 4,552 Times in 4,516 Posts
    Code:
    <script type="text/javascript">
    var theImages = ["100.jpg","200.jpg","300.jpg","400.jpg"];
    theImages.sort( new function() { return Math.random() - 0.5; } );
    
    var curImage = 0;
    function showImage()
    {
        var show = curImage % theImages.length;
        ++curImage;
        document.write('<img src="'+theImages[show]+'">');
    }
    </script>
    (a) There is no reason to preload the images when you are going to document.write <img> tags, anyway. You only preload when you will be changing images *after* the page is loaded.
    (b) The use of <!-- and --> became unnecessary when MSIE 3 died an overdue death....back in 1998 or so.
    (c) The use of language="..." is almost as out of date. Use type="..." instead, as shown.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    New Coder
    Join Date
    Oct 2010
    Posts
    37
    Thanks
    3
    Thanked 0 Times in 0 Posts
    ok, i replaced the header script with that and now it isnt displaying any images, sorry im a newbie

  • #4
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,128
    Thanks
    38
    Thanked 504 Times in 498 Posts

    Lightbulb

    Here's my attempt at changing your code. Old Pedant's may be shorter, but I tried to use as much of your code as possible...
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/javascript; charset=windows-1252" />
    <title>Untitled Document</title>
    <script type="text/javascript"> <!-- archaic form: language="JavaScript" -->
    
    var baseURL = 'http://www.nova.edu/hpd/otm/pics/4fun/';  // path to image directory
    var theImages = ['11.jpg','21.jpg','31.jpg','41.jpg'];
    var preBuffer = [];
    
    for (var i=0; i<theImages.length; i++) {
       preBuffer[i] = new Image();
       preBuffer[i].src = theImages[i];
    }
    
    function randOrd() {
      return (Math.round(Math.random())-0.5);
    }
    
    function showImage(){
      theImages = theImages.sort(randOrd);
      document.write('<img src="'+baseURL+theImages[0]+'">');
      document.write('&nbsp; or ');
      document.write('<img src="'+baseURL+theImages[1]+'">');
    }
    
    </script>
    </head>
    <body>
    
    <div align="center"></div>
    <table width="996" height="511" border="1">
      <tr>
       <th scope="col"><script type="text/javascript"> showImage(); </script></th>
      </tr>
    </table>
    </body>
    </html>
    Change the 'baseURL' and image names to your files.

    Good Luck!

  • Users who have thanked jmrker for this post:

    fus10n (12-10-2010)

  • #5
    New Coder
    Join Date
    Oct 2010
    Posts
    37
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thank you so much!

  • #6
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,128
    Thanks
    38
    Thanked 504 Times in 498 Posts

    Thumbs up

    Quote Originally Posted by fus10n View Post
    Thank you so much!
    Your most welcome.
    I'm glad we could help (whatever code you used).
    Good Luck!


  •  

    Posting Permissions

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