Superimpose one image on another

S

SteveCrockett

My first page on frontpage has an image of a tee shirt. I also have an image
of a
design to put on the tee shirt.

What steps do I need to take to move the image onto the tee shirt
I am using frontpage 2002.

Thank you in advance for any help.
 
T

Thomas A. Rowe

You have to do this with a image editor

--
==============================================
Thomas A. Rowe
Microsoft MVP - FrontPage
==============================================
Agents Real Estate Listing Network
http://www.NReal.com
==============================================
 
D

David Berry

I thought we did a site like this that superimposed text over an image for
something? Can't remember which site or what the effect was.
 
D

David Berry

Tom and I have worked on a few web sites together. I was thinking that we
used something like this on one of them.
 
T

Thomas A. Rowe

The shirt would have to be a background image.

--
==============================================
Thomas A. Rowe
Microsoft MVP - FrontPage
==============================================
Agents Real Estate Listing Network
http://www.NReal.com
==============================================
 
W

Windsun

You can do it with CSS, but the positioning across various browsers can be
pretty tricky

-------------------------------------------------------------------------
 
K

Kevin Spencer

Using CSS with absolute positioning (whether you want to use absolute
positioning or not is up to you), it is relatively easy. In the following
example, I created a page-level CSS style sheet with 2 div styles, both of
which use absolute positioning. The first is a container for an image, and
the second is a label for an image. The HTML following the style sheet
example is an example of the usage:

<style type="text/css">
div.collage {
padding: 0px;
margin: 0px;
border-style: none;
border-width: 0px;
z-index: auto;
position: absolute;
}
div.label {
padding: 0px;
margin: 0px;
border-style: none;
border-width: 0px;
position: absolute;
z-index: 100;
}
}
</style>


<div style="width: 255px; left: 278px; top: 50px" class="collage">
<img src="images/chutney(large).gif" width="256" height="260" alt="Chutney"
/>
<div class="label" style="left: 0px; top: 222px; width: 255px; color:
#FFFFFF; text-align: center;">
<strong>Label</strong></div></div>

--
HTH,

Kevin Spencer
Microsoft MVP
Short Order Coder
http://unclechutney.blogspot.com

The devil is in the yada yada yada
 
M

Murray

Kevin:

Not to be picky, but I would redo your CSS like this -

<style type="text/css">
div.collage {
padding: 0;
margin: 0;
z-index: 1;
position: absolute;
}
div.label {
padding: 0;
margin: 0;
position: absolute;
z-index: 100;
}
/* } typo? */
</style>
 
M

Mike Mueller

There was a site of a man with a t-shirt and the image was
generated with an aspx file using C#. That is the first
thing I thought of when I read the OP



: Tom and I have worked on a few web sites together. I was
thinking that we
: used something like this on one of them.
:
:
: : > Huh??
: >
: > --
: > Eleanor T. Culling
: > Leavenworth, WA
: > Enjoy my photography at
: > www.eleanorstravels.com
: > http://www.eleanorstravels.com/photoblog-issue1.htm
: > : >>I thought we did a site like this that superimposed text
over an image for
: >>something? Can't remember which site or what the effect
was.
: >>
: >>
: >>
: >> : >>> You have to do this with a image editor
: >>>
: >>> --
: >>> ==============================================
: >>> Thomas A. Rowe
: >>> Microsoft MVP - FrontPage
: >>> ==============================================
: >>> Agents Real Estate Listing Network
: >>> http://www.NReal.com
: >>> ==============================================
: >>>
: >>>
: >>> "SteveCrockett"
: >>> message
: >>>> My first page on frontpage has an image of a tee
shirt. I also have an
: >>>> image
: >>>> of a
: >>>> design to put on the tee shirt.
: >>>>
: >>>> What steps do I need to take to move the image onto
the tee shirt
: >>>> I am using frontpage 2002.
: >>>>
: >>>> Thank you in advance for any help.
: >>>
: >>>
: >>
: >>
: >
: >
:
:
 
K

Kevin Spencer

Hi Murray,

Pickiness is my middle name! ;-)
/* } typo? */

Yes, that was a typo, not sure how it got there via copy/paste.

The border-width was unnecessary, and I just didn't clean up after my
experiment. Didn't hurt anything, though, other than bandwidth (marginally).

As for your mod of the z-index in the first style, I was presuming that more
than one image might be in the page, using the same technique. If they
overlapped, the z-indices would be incremented according to their order on
the page. That's why the second style had such a high z-index. But in either
case, it's good.

Always appreciate having a code review!

--
HTH,

Kevin Spencer
Microsoft MVP
Short Order Coder
http://unclechutney.blogspot.com

The devil is in the yada yada yada
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top