spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column89


Print Templates, Part I

Developer News
OpenOffice 3.2 Lands Amid Critical Changes
Red Hat, IBM Firmly in KVM Virtualization Camp
Red Hat Talks Up Open Source Cloud Plans

Content Rendering

The LayoutRect behavior formats the page content itself. You need one LayoutRect per page. The LayoutRect element is defined inside the DeviceRect element. The content of each LayoutRect element is limited to one page. Once a page is filled, formatting jumps to the next page automatically. You need to define LayoutRect's style, as you did for DeviceRect. Suppose we want the content portion of the page to have the following characteristics:

  • 5.5 inches wide
  • 8 inches high
  • 1 inch margin from all sides
  • White background
  • 1 inch wide gray dashed border

We can define a style, contentstyle, as follows:

<STYLE TYPE="text/css">
.contentstyle
{
  width:5.5in;
  height:8in;
  margin:1in;
  background:white;
  border:1 dashed gray;
}
</STYLE>

We can use the LayoutRect elements to format any content. Examine what the second page of this column looks like with the style above. Here is the HTML code:

<HTML>
<HEAD>
<?IMPORT NAMESPACE="IE" IMPLEMENTATION="#default">
<STYLE TYPE="text/css">
.contentstyle
{
  width:5.5in;
  height:8in;
  margin:1in;
  background:white;
  border:1 dashed gray;
}
</STYLE>
</HEAD>

<BODY>
<IE:LAYOUTRECT ID="layoutrect1"  CONTENTSRC="2.html"
  CLASS="contentstyle" NEXTRECT="layoutrect2"/>

<IE:LAYOUTRECT ID="layoutrect2" CLASS="contentstyle"/>
</BODY>
</HTML>

This HTML code is similar to the example on the previous page except that DeviceRect is replaced with LayoutRect. Again, DeviceRect formats the master page, while LayoutRect formats the content. Notice the attributes of LayoutRect above. The ID attribute needs to be unique per page. The CONTENTSRC attribute specifies the URL of the content to be formatted. Here we specify Page 2 of this column. The CLASS attribute links the element with its designated style definition, contentstyle. For each page, you need to specify which element is next in line to hold the content overlfow. Use the NEXTREC attribute to list the ID of the next LayoutRect element. In our case above, we include only two pages, and indeed you can see that Page 2 does not need more than two pages.

Next: How to create a static print template with DeviceRect and LayoutRect

http://www.internet.com


The Network for Technology Professionals

Search:

About Internet.com

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | E-mail Offers

webref The latest from WebReference.com Browse >
Installing and Using Meeplace, the Business Review CMS · Sending an HTML and Plain Text E-newsletter with ASP.NET, Part 2 · Create Multilingual Web Sites with Windows Unicode Fonts
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
MySql View Technique for Grouping Crosstab Column Data · Why You Need a Mobile Web Site · Tame Web Marketing with Social Media Management


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: July 30, 2001
Revised: July 30, 2001

URL: http://www.webreference.com/js/column89/4.html