• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 125
  • Last Modified:

Make page background fit contents of page

I have a template that I've created in Fireworks and is exported as a table of graphics.  To insert HTML content, I'm using layers in Dreamweaver.  I've seen other similar pages where the page and left border height automatically adjust based on the length of page content.  I'd like to, if possible, make this the case with my page.  Currently, if the page content is longer than my left banner, I have to go and re-export the graphics table after I lengthen the left border.  Is it possible to change my code to somehow make my pages auto adjust to content length.  

Please let me know if further clarification is needed, or you're interested in taking a look at my current code.

Thanks!
0
johnson00
Asked:
johnson00
  • 3
  • 2
1 Solution
 
COBOLdinosaurCommented:
Not if it is a background.  The size of a background image is not dynamic.

If it is an image in a layer, the you can dynamically size it with scripting.  We would need to see the code to work how to handle dynamic re-sizing

Cd&
0
 
johnson00Author Commented:
<html>
<head>
<title>ContactTemplate.jpg</title>
<meta http-equiv="Content-Type" content="text/html;">
<!--Fireworks MX 2004 Dreamweaver MX 2004 target.  Created Wed Sep 22 08:47:15 GMT-0500 (Central Standard Time) 2004-->
<script language="JavaScript">
<!--
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_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])?args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) { img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr) for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}

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];}}
}

//-->
</script>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<style type="text/css">
<!--
.style1 {
      font-size: small;
      font-weight: bold;
}
.style2 {font-size: small}
-->
</style>
</head>
<body bgcolor="#ffffff" onLoad="MM_preloadImages('images/ContactTemplate_r2_c5_f2.gif','images/ContactTemplate_r2_c5_f3.gif','images/ContactTemplate_r2_c6_f2.jpg','images/ContactTemplate_r2_c6_f3.jpg','images/ContactTemplate_r2_c7_f2.jpg','images/ContactTemplate_r2_c7_f3.jpg','images/ContactTemplate_r2_c8_f2.jpg','images/ContactTemplate_r2_c8_f3.jpg','images/ContactTemplate_r4_c2_f2.gif','images/ContactTemplate_r4_c2_f3.gif','images/ContactTemplate_r5_c2_f2.jpg','images/ContactTemplate_r5_c2_f3.jpg','images/ContactTemplate_r6_c2_f2.jpg','images/ContactTemplate_r6_c2_f3.jpg','images/ContactTemplate_r7_c2_f2.jpg','images/ContactTemplate_r7_c2_f3.jpg','images/ContactTemplate_r8_c2_f2.jpg','images/ContactTemplate_r8_c2_f3.jpg','images/ContactTemplate_r9_c3_f2.jpg','images/ContactTemplate_r9_c3_f3.jpg','images/ContactTemplate_r10_c2_f2.jpg','images/ContactTemplate_r10_c2_f3.jpg','images/ContactTemplate_r11_c2_f2.jpg','images/ContactTemplate_r11_c2_f3.jpg');">
<div id="Layer1" style="position:absolute; width:511px; height:115px; z-index:1; left: 249px; top: 121px;">
  <p>&nbsp;</p>
  <p class="style1">Contact Information</p>
  <div align="justify">
    <p>Thank you for visiting Springfield Clinic's website.  We hope the posted information has been useful to you, and has increased your satisfaction with Clinic services.</p>
    <p class="style1">Patient Billing Office </p>
    <p class="style1">&nbsp;    </p>
  </div>
  <p class="style2">&nbsp;</p>
</div>
<table border="0" cellpadding="0" cellspacing="0" width="756">
<!-- fwtable fwsrc="Master.png" fwbase="ContactTemplate.jpg" fwstyle="Dreamweaver" fwdocid = "1698286417" fwnested="0" -->
  <tr>
   <td><img src="images/spacer.gif" width="5" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="206" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="211" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="93" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="71" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="84" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="81" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="4" height="1" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
  </tr>

  <tr>
   <td colspan="9"><img name="ContactTemplate_r1_c1" src="images/ContactTemplate_r1_c1.jpg" width="756" height="70" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="70" border="0" alt=""></td>
  </tr>
  <tr>
   <td rowspan="2" colspan="4"><img name="ContactTemplate_r2_c1" src="images/ContactTemplate_r2_c1.jpg" width="423" height="36" border="0" alt=""></td>
   <td><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r2_c5','images/ContactTemplate_r2_c5_f2.gif','images/ContactTemplate_r2_c5_f3.gif',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r2_c5','images/ContactTemplate_r2_c5_f3.gif',1);"><img name="ContactTemplate_r2_c5" src="images/ContactTemplate_r2_c5.gif" width="93" height="14" border="0" alt=""></a></td>
   <td><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r2_c6','images/ContactTemplate_r2_c6_f2.jpg','images/ContactTemplate_r2_c6_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r2_c6','images/ContactTemplate_r2_c6_f3.jpg',1);"><img name="ContactTemplate_r2_c6" src="images/ContactTemplate_r2_c6.jpg" width="71" height="14" border="0" alt=""></a></td>
   <td><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r2_c7','images/ContactTemplate_r2_c7_f2.jpg','images/ContactTemplate_r2_c7_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r2_c7','images/ContactTemplate_r2_c7_f3.jpg',1);"><img name="ContactTemplate_r2_c7" src="images/ContactTemplate_r2_c7.jpg" width="84" height="14" border="0" alt=""></a></td>
   <td><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r2_c8','images/ContactTemplate_r2_c8_f2.jpg','images/ContactTemplate_r2_c8_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r2_c8','images/ContactTemplate_r2_c8_f3.jpg',1);"><img name="ContactTemplate_r2_c8" src="images/ContactTemplate_r2_c8.jpg" width="81" height="14" border="0" alt=""></a></td>
   <td rowspan="11"><img name="ContactTemplate_r2_c9" src="images/ContactTemplate_r2_c9.jpg" width="4" height="680" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="14" border="0" alt=""></td>
  </tr>
  <tr>
   <td rowspan="10" colspan="4"><img name="ContactTemplate_r3_c5" src="images/ContactTemplate_r3_c5.jpg" width="329" height="666" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="22" border="0" alt=""></td>
  </tr>
  <tr>
   <td rowspan="9"><img name="ContactTemplate_r4_c1" src="images/ContactTemplate_r4_c1.jpg" width="5" height="644" border="0" alt=""></td>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r4_c2','images/ContactTemplate_r4_c2_f2.gif','images/ContactTemplate_r4_c2_f3.gif',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r4_c2','images/ContactTemplate_r4_c2_f3.gif',1);"><img name="ContactTemplate_r4_c2" src="images/ContactTemplate_r4_c2.gif" width="207" height="23" border="0" alt=""></a></td>
   <td rowspan="9"><img name="ContactTemplate_r4_c4" src="images/ContactTemplate_r4_c4.jpg" width="211" height="644" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="23" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r5_c2','images/ContactTemplate_r5_c2_f2.jpg','images/ContactTemplate_r5_c2_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r5_c2','images/ContactTemplate_r5_c2_f3.jpg',1);"><img name="ContactTemplate_r5_c2" src="images/ContactTemplate_r5_c2.jpg" width="207" height="27" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r6_c2','images/ContactTemplate_r6_c2_f2.jpg','images/ContactTemplate_r6_c2_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r6_c2','images/ContactTemplate_r6_c2_f3.jpg',1);"><img name="ContactTemplate_r6_c2" src="images/ContactTemplate_r6_c2.jpg" width="207" height="25" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="25" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r7_c2','images/ContactTemplate_r7_c2_f2.jpg','images/ContactTemplate_r7_c2_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r7_c2','images/ContactTemplate_r7_c2_f3.jpg',1);"><img name="ContactTemplate_r7_c2" src="images/ContactTemplate_r7_c2.jpg" width="207" height="31" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="31" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r8_c2','images/ContactTemplate_r8_c2_f2.jpg','images/ContactTemplate_r8_c2_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r8_c2','images/ContactTemplate_r8_c2_f3.jpg',1);"><img name="ContactTemplate_r8_c2" src="images/ContactTemplate_r8_c2.jpg" width="207" height="23" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="23" border="0" alt=""></td>
  </tr>
  <tr>
   <td><img name="ContactTemplate_r9_c2" src="images/ContactTemplate_r9_c2.jpg" width="1" height="28" border="0" alt=""></td>
   <td><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r9_c3','images/ContactTemplate_r9_c3_f2.jpg','images/ContactTemplate_r9_c3_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r9_c3','images/ContactTemplate_r9_c3_f3.jpg',1);"><img name="ContactTemplate_r9_c3" src="images/ContactTemplate_r9_c3.jpg" width="206" height="28" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="28" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r10_c2','images/ContactTemplate_r10_c2_f2.jpg','images/ContactTemplate_r10_c2_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r10_c2','images/ContactTemplate_r10_c2_f3.jpg',1);"><img name="ContactTemplate_r10_c2" src="images/ContactTemplate_r10_c2.jpg" width="207" height="27" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><a href="#" onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','ContactTemplate_r11_c2','images/ContactTemplate_r11_c2_f2.jpg','images/ContactTemplate_r11_c2_f3.jpg',1);" onClick="MM_nbGroup('down','navbar1','ContactTemplate_r11_c2','images/ContactTemplate_r11_c2_f3.jpg',1);"><img name="ContactTemplate_r11_c2" src="images/ContactTemplate_r11_c2.jpg" width="207" height="23" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="23" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="2"><img name="ContactTemplate_r12_c2" src="images/ContactTemplate_r12_c2.jpg" width="207" height="437" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="437" border="0" alt=""></td>
  </tr>
</table>
</body>
</html>
0
 
COBOLdinosaurCommented:
That's what I was afraid of.  This is the lline that controls it, the the browser cannot ever see it.  
<!-- fwtable fwsrc="Master.png" fwbase="ContactTemplate.jpg" fwstyle="Dreamweaver" fwdocid = "1698286417" fwnested="0" -->

The only way to change it is with the tool.  I don't sse a way to do it dynamically.  You are
limited by the tool.  Pages that are dynamic are general hand coded or code with tools that
don't stick a lot of stuff in.  

I don't know of a way to solve your problem, but maybe another expert used to working with
the Macro Media stuff will come along and have a suggestion.

Cd&
0
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

 
johnson00Author Commented:
Perhaps I should also post in the DreamWeaver section for advice there.  I wasn't sure where the appropriate place would be.  What tool are you speaking of?
0
 
johnson00Author Commented:
arantius -

Thank you for the link.  I've looked over the information there, and hope you can answer a few questions regarding the content there.

Their example assumes that the page is done solely in layers (div).  My page's main content is in a div, but the graphics are

not in a div.  Can you take a look at the code I posted and help me figure out how this solution would work with my code?

Thank you!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: SQL Server Core 2016

This course will introduce you to SQL Server Core 2016, as well as teach you about SSMS, data tools, installation, server configuration, using Management Studio, and writing and executing queries.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now