Question: Modifying Zen Cart Top Banner for Expandable Width

[timotheos]

[FONT=Times New Roman]I'm setting up a Zen Store for the first time.[/FONT]

[FONT=Times New Roman]I'm using a template that expands with the browser width.[/FONT]

[FONT=Times New Roman]I want to insert a top banner, part of which is static, but want to know if one could insert another expandable image with this so that the whole banner seamlessly expands and contracts.[/FONT]

[FONT=Times New Roman]One has this kind of code going on:[/FONT]

[FONT=Times New Roman]define('HEADER_ALT_TEXT', 'Powered by Zen Cart :: The Art of E-Commerce');[/FONT]

[FONT=Times New Roman]define('HEADER_SALES_TEXT', 'TagLine Here');[/FONT]

[FONT=Times New Roman]define('HEADER_LOGO_WIDTH', '799px');[/FONT]

[FONT=Times New Roman]define('HEADER_LOGO_HEIGHT', '119px');[/FONT]

[FONT=Times New Roman]define('HEADER_LOGO_IMAGE', 'logo.gif');[/FONT]

[FONT=Times New Roman]Is there a way to modify this code and also add a 1 pixel by 119 pixel graphic next the other so that it can adjust its width to the larger browser sizes like 1024, etc. (That way I can keep a perfect color match, my stripes, etc., and fill in that empty space.)[/FONT]

[gjh42]

You can use background images attached to different sides of various divs.

Search this forum, or google for descriptions of the sliding door method. There is a site that has the ultimate directions for this.

[timotheos]

Hi Glenn,

Many thanks. I am going to [FONT=Times New Roman]pursue[/FONT] your info to learn even more.

I found through the Zen Cart site, that one could get a background image in behind the header in the CSS stylesheet. This works perfectly.

I updated my stylesheet with this code:

#logoWrapper{
background-image: url(../images/header_bg.gif);
background-repeat: repeat-x;
background-color: #ffffff;
height:119px;
}


"background-repeat: repeat-x;" makes this exand and contract as much as needed. I'm a novice and that's why originally I thought of such a complicated way of doing this which was replaced with the simple solution above.

- Tim