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
  1. #1
    New to the CF scene
    Join Date
    Sep 2005
    Location
    Cheltenham, England
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Random Image Question/Problem

    Okay, so hopefully I'll explain this without confusing you all too much!

    I'm designing a new layout for the website I run, and as part of that layout, I've decided to use a Random Image code, just to spice things up!

    Anyhoo, the code works fine, that's not a problem. The problem is:

    I have my random images loading in a table cell, and beneath that cell, i have another cell containing the graphic for the menu bar.
    Instead of the menu being directly under the random image (which is what I want), something is causing it to leave a small gap between the bottom of the random image and the next cell.

    I have used the Valign tag to align the images to the top (so thats not the problem).
    I have also set the cellpadding and cellspacing properties to "0" - so that's not a problem either.

    But it's still leaving a gap between the random image and the cell below, and I have no idea why! Can anyone help me?

    Here is a sample of the html for the tables in the page:

    Code:
    <table width="524" height="100%" border="0" bgcolor="white" cellpadding="0" 
    
    cellspacing="0" align="center">
    
    <tr>
    <td width="12" background="images/left.jpg">&nbsp;</td>
    <td width="500" valign="top" height="30">
    <img src="images/top.jpg" width="500" height="30"></td>
    <td width="12" background="images/right.jpg">&nbsp;</td>
    </tr>
    
    <tr>
    <td width="12" background="images/left.jpg">&nbsp;</td>
        <td width="500" height="200" valign="top"> 
          <SCRIPT LANGUAGE="Javascript"><!--
    
    function image() {
    };
    
    image = new image();
    number = 0;
    
    // imageArray
    image[number++] = "<img src='images/main001.jpg' border='0'>"
    image[number++] = "<img src='images/main002.jpg' border='0'>"
    image[number++] = "<img src='images/main003.jpg' border='0'>"
    image[number++] = "<img src='images/main004.jpg' border='0'>"
    image[number++] = "<img src='images/main005.jpg' border='0'>"
    //
    
    increment = Math.floor(Math.random() * number);
    
    document.write(image[increment]);
    
    //--></SCRIPT>
        </td>
    <td width="12" background="images/right.jpg">&nbsp;</td>
    </tr>
    
    <tr>
    <td width="12" background="images/left.jpg">&nbsp;</td>
        <td width="500" height="20" valign="top"> 
    <img src="images/menu.jpg" width="500" height="20" align="top"></td>
    <td width="12" background="images/right.jpg">&nbsp;</td>
    </tr>
    
    <tr>
    <td width="12" background="images/left.jpg">&nbsp;</td>
    <td width="500" valign="top"> 
    
    <!-- START PAGE CONTENT -->
    
          <p>the page contents will go in here!!! </p>
         
    <!-- END PAGE CONTENT -->
        
    </td>
    <td width="12" background="images/right.jpg">&nbsp;</td>
    </tr>
    </table>
    If anyone can help i'll be your bestest friend for life! If you need more info, then just pvt me and i can send you more!

    Thanks, Andy

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,703
    Thanks
    0
    Thanked 233 Times in 228 Posts
    Hi there andiuk,

    and a warm welcome to these forums.

    I assume that this problem is occuring in IE.
    IE creates 'whitespace' when the </td> tags are not closed up to the <img>
    So change...
    Code:
    
    increment = Math.floor(Math.random() * number);
    
    document.write(image[increment]);
    
    //--></SCRIPT>
        </td>
    
    ...to this...
    Code:
    
    increment = Math.floor(Math.random() * number);
    
    document.write(image[increment]);
    
    //--></SCRIPT></td>
    
    ...and see if that provides a cure.

    coothead

  • #3
    New to the CF scene
    Join Date
    Sep 2005
    Location
    Cheltenham, England
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by coothead
    Hi there andiuk,

    and a warm welcome to these forums.

    I assume that this problem is occuring in IE.
    IE creates 'whitespace' when the </td> tags are not closed up to the <img>
    So change...
    Code:
    
    increment = Math.floor(Math.random() * number);
    
    document.write(image[increment]);
    
    //--></SCRIPT>
        </td>
    
    ...to this...
    Code:
    
    increment = Math.floor(Math.random() * number);
    
    document.write(image[increment]);
    
    //--></SCRIPT></td>
    
    ...and see if that provides a cure.

    coothead
    i don't... it... i... it works.... *swoons*

    thanks sooooo much... if only we could have spoken before i'd pulled out enough hair to make a small bald patch...

    that's cool - i really can't thank you enough, i've been pulling my friggin' hair out tryin to fix that!!! i'm such a moron!!!

    a pox on IE... :P


  •  

    Posting Permissions

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