WEB Coding Question

Discussion in 'OT Technology' started by AnoesisX, Jan 21, 2008.

  1. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    I know this is noobish question how do you make website resize to screen resolution?
     
  2. tryfuhl

    tryfuhl New Member

    Joined:
    Oct 4, 2003
    Messages:
    75,450
    Likes Received:
    0
    Location:
    MD/DC Metro
  3. ez4me2c3d

    ez4me2c3d Cold Member

    Joined:
    Sep 19, 2003
    Messages:
    1,836
    Likes Received:
    0
    Location:
    Minneapolis, MN
    oh lord, don't do that...

    nothing worse than giving a web programmer the ability to move my windows around on my screen.
     
  4. drpepper

    drpepper Active Member

    Joined:
    Nov 13, 2006
    Messages:
    38,076
    Likes Received:
    2
    Location:
    San Antonio
    width: 0px auto?
     
  5. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida

    what do you mean? Where do you put that? sorry, Im new at this.
     
  6. ez4me2c3d

    ez4me2c3d Cold Member

    Joined:
    Sep 19, 2003
    Messages:
    1,836
    Likes Received:
    0
    Location:
    Minneapolis, MN
    don't size the window to your content, size your content to the window
     
  7. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    thanks Confucius. Anyway this is the website im working on http://www.thesfjimmy.com/index2.htm

    The people that I'm making this for complained that in some computers they have to scroll to the right in order to view the site. I know this is a resolution issue. so whats a quick fix for. Is there a script that automatically adjusts the alignment based on the individuals browser and screen resolution?
     
  8. drpepper

    drpepper Active Member

    Joined:
    Nov 13, 2006
    Messages:
    38,076
    Likes Received:
    2
    Location:
    San Antonio
    oh, then put this in your css

    width: 100%;

    that will resize your site to match the browser window on any resolution.
     
  9. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    tried that didn't seem to work can you tell me where?

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <!-- saved from url=(0014)about:internet -->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>The South Florida Jimmy - Nightlife - Music - Humor</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style type="text/css">
    td img {display: block;}#apDiv1 {
        position:absolute;
        left:179px;
        top:9px;
        width:100%;
        height:163px;
        z-index:1;
    }
    #apDiv2 {
        position:absolute;
        left:179px;
        top:148px;
        width:100%;
        height:470px;
        z-index:2;
    }
    body {
        background-image: url(bg.jpg);
    }
    #apDiv3 {
        position:absolute;
        left:746px;
        top:38px;
        width:100%;
        height:61px;
        z-index:3;
    }
    </style>
    <!--Fireworks CS3 Dreamweaver CS3 target.  Created Thu Jan 17 17:25:45 GMT-0500 (Eastern Standard Time) 2008-->
    <script type="text/javascript">
    <!--
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    </script>
    </head>
    <body bgcolor="#ffffff" onload="MM_preloadImages('layout_r2_c2b.jpg','layout_r2_c3b.jpg','layout_r2_c4b.jpg','layout_r2_c5b.jpg','layout_r2_c6b.jpg')">
    <div id="apDiv1">
      <table border="0" cellpadding="0" cellspacing="0" width="0px auto">
        <!-- fwtable fwsrc="Untitled" fwpage="Page 1" fwbase="layout.jpg" fwstyle="Dreamweaver" fwdocid = "1365083927" fwnested="0" -->
        <tr>
          <td><img src="spacer.gif" width="99" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="123" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="116" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="88" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="72" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="106" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="360" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
          <td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
        </tr>
        <tr>
          <td colspan="8"><img src="layout_r1_c1.jpg" alt="img" name="layout_r1_c1" width="965" height="107" border="0" usemap="#layout_r1_c1Map" id="layout_r1_c1" /></td>
          <td><img src="spacer.gif" width="1" height="107" border="0" alt="" /></td>
        </tr>
        <tr>
          <td><img name="layout_r2_c1" src="layout_r2_c1.jpg" width="99" height="31" border="0" id="layout_r2_c1" alt="img" /></td>
          <td><a href="mags/0108/index.html" target="main" onmouseover="MM_swapImage('Image22','','layout_r2_c2b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="layout_r2_c2.jpg" alt="img" name="Image22" width="123" height="31" border="0" id="Image22" /></a></td>
          <td><a href="http://www.thesfjimmy.com/backissues.html" target="main" onmouseover="MM_swapImage('Image23','','layout_r2_c3b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="layout_r2_c3.jpg" name="Image23" width="116" height="31" border="0" id="Image23" /></a></td>
          <td><a href="http://www.thesfjimmy.com/nightlife.html" target="main" onmouseover="MM_swapImage('Image24','','layout_r2_c4b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="layout_r2_c4.jpg" name="Image24" width="88" height="31" border="0" id="Image24" /></a></td>
          <td><a href="http://www.thesfjimmy.com/music.html" target="main" onmouseover="MM_swapImage('Image25','','layout_r2_c5b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="layout_r2_c5.jpg" name="Image25" width="72" height="31" border="0" id="Image25" /></a></td>
          <td><a href="http://www.thesfjimmy.com/advertise.html" target="main" onmouseover="MM_swapImage('Image26','','layout_r2_c6b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="layout_r2_c6.jpg" name="Image26" width="106" height="31" border="0" id="Image26" /></a></td>
          <td colspan="2"><img name="layout_r2_c7" src="layout_r2_c7.jpg" width="361" height="31" border="0" id="layout_r2_c7" alt="" /></td>
          <td><img src="spacer.gif" width="1" height="31" border="0" alt="" /></td>
        </tr>
        <tr>
          <td colspan="7">&nbsp;</td>
          <td><img name="layout_r3_c8" src="layout_r3_c8.jpg" width="1" height="470" border="0" id="layout_r3_c8" alt="" /></td>
          <td><img src="spacer.gif" width="1" height="470" border="0" alt="" /></td>
        </tr>
      </table>
    </div>
    <div id="apDiv2">
    <iframe width="964" name="main" height="470" src="main.html" border="0" frameborder="0" scrolling="auto" align="left" hspace="0" vspace="0"></iframe></div>
    
    <div id="apDiv3"><img src="images/melo.jpg" width="337" height="63" border="0" usemap="#Map" />
    <map name="Map" id="Map"><area shape="rect" coords="4,4,333,59" href="http://www.meloent.com" target="_blank" />
    </map></div>
    <map name="layout_r1_c1Map" id="layout_r1_c1Map"><area shape="rect" coords="25,5,363,100" href="main.html" target="main" />
    </map></body>
    </html>
    
     
  10. RoblesGT

    RoblesGT [Track Days: 19 ][Crashes: 1] [SuMo Days: 1 ][Cras OT Supporter

    Joined:
    Aug 10, 2001
    Messages:
    66,024
    Likes Received:
    62
    Location:
    Arizona
    if youre images are too big, they will make the page scroll sideways ...

    solution ?? less images ... more styles ... if you can
     

Share This Page