SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Top margin persist after placing Javascript

    Hi everybody!

    In my webpage I have set that the left & top margins are '0' and it worked fine.

    However, after inserting of a Random Image Javascript,there is a blank space on the top.

    Site URL: Untitled Document

    Below are the html codes:

    "

    Code HTML4Strict:
    <!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/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    body {
    	margin-left: 0px;
    	margin-top: 0px;
    }
    body{
    margin: 0;
    padding: 0;
    }
    </style>
    </head>
     
    <body>
     
    <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td align="left" valign="top">&nbsp;</td>
      </tr><script language="JavaScript" type="text/javascript">
    // This script was supplied by Dave Joosten
    // For support and info go read the Tutorial at [url=http://www.dmxzone.com/ShowDetail.asp?NewsId=5417]Random Images by using simple to modify JavaScript - AJAX and JavaScript - Tutorials - DMXzone.COM[/url]
    var id = 3; // Total number of images
    var ranimage = new Array(id); // Array to hold the filenames
     
    ranimage[0] = "japgirl.jpg";
    ranimage[1] = "japgirl2.jpg";
    ranimage[2] = "japgirl3.jpg";
     
    function choseRandom(range) {
    if (Math.random)
    return Math.round(Math.random() * (range-1));
    else {
    var now = new Date();
    return (now.getTime() / 1000) % range;
    }
    }
    // 
    var choice = choseRandom(id);
    </script>
     
    <script language="JavaScript">document.writeln('<td' + '><img src="' + ranimage[choice] + '" height="auto" width="100%" hspace="0" vspace="0" border="0" margin: 0; ><' + '/td>');</script>
     <style type="text/css">
    body {
    	margin-left: 0px;
    	margin-top: 0px;
    }
    body{
    margin: 0;
    padding: 0;
    }
    </style>
     
    </table>
    </body>
    </html>
    "

    May I know what caused the problem and what is the fix please?


    Thanks for any help and advice.

    Lawrence
    Last edited by Mittineague; Apr 12, 2011 at 19:22. Reason: reformatting bbcode tags

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,196
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    The problem is the empty TD element on the page, remove the following and the space will no longer appear.

    HTML Code:
    <tr>
        <td align="left" valign="top">&nbsp;</td>
    </tr>

  3. #3
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the help, SgtLegend

    It works like a charm now.

    Best regards

  4. #4
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,196
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    No problem


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
  •