[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

Make page background fit contents of page

Posted on 2004-10-28
7
Medium Priority
?
121 Views
Last Modified: 2010-04-06
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
Comment
Question by:johnson00
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
7 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 12438669
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
 
LVL 2

Author Comment

by:johnson00
ID: 12439126
<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
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 1000 total points
ID: 12439300
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
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 2

Author Comment

by:johnson00
ID: 12443722
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
 
LVL 18

Expert Comment

by:arantius
ID: 12444365
0
 
LVL 2

Author Comment

by:johnson00
ID: 12445798
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

Featured Post

Enroll in October's Free Course of the Month

Do you work with and analyze data? Enroll in October's Course of the Month for 7+ hours of SQL training, allowing you to quickly and efficiently store or retrieve data. It's free for Premium Members, Team Accounts, and Qualified Experts!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question