[Pro] Text box question

How do I embed an opaque text box on top of a psd graphic?

And if I need to, how do I make it a scrolling box?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you’re working in a layered layout, then just draw an HTML box over
top of your picture, set the background to a solid color, and the
Overflow to either Auto or Scroll. (Both will show scroll bars, but
Auto will only show them when they’re needed.)

Walter

On Mar 4, 2009, at 12:50 PM, Amanda wrote:

How do I embed an opaque text box on top of a psd graphic?

And if I need to, how do I make it a scrolling box?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 4 Mar 2009, 4:55 pm, waltd wrote:

If you’re working in a layered layout, then just draw an HTML box over
top of your picture, set the background to a solid color, and the
Overflow to either Auto or Scroll. (Both will show scroll bars, but
Auto will only show them when they’re needed.)

Walter

What do you mean by layered layout? I’m familiar with the photoshop layering system, but I can’t really control it in FW. If I click the “layer” box for my background psd graphic, then the rollovers sitting on top of it will disappear.

Oh, and please explain what overflow is, and how to make the box opaque.

Thanks!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If your rollovers are also layers, then they will float in whatever
order you place them in.

In terms of layers and HTML/CSS (this isn’t a Freeway thing – it’s a
Web thing) there are two layers you can’t move, and then N number of
additional layers above that.

The first layer is the page background layer. Imagine this as the
Zeroth layer, it sits below everything else. You may set it to be
filled with a photo or a solid color or both. In Freeway, you control
this through the Page Inspector, in the Style tab.

The next layer is the “table layout layer”. If you have drawn HTML or
Graphic Items on the page while the CSS Layout button was off (set to
Table Layout), then you have drawn elements into this table layout
layer. These elements cannot overlap one another, unless they are all
graphics. When that happens, Freeway either auto-slices the images to
fake the overlap effect, or it merges all overlapping graphics into
one massive image.

Finally, floating above those two base layers is the world of the z-
index. CSS Layers are individual DIV (division) elements positioned
outside of the page flow. They exist in their own strange world, where
they each believe they are entirely alone in the universe. They may
appear to overlap, but really they are miles apart, kind of like
watching planes landing at a busy airport (hopefully, for the
airplanes and their passengers).

If you have the CSS Layout button on, and you draw an HTML box, you
will get a layer, not unlike a Photoshop layer. It will have its own z-
index all to itself, and no other object on the page can move it or
influence it in any way. If another layered object grows or shrinks
because of text or other content changing, then it may appear to
overlap or underlap our intrepid layer element. But it won’t be
“pushed around” by the changes in that other content.

If you are not in CSS Layout mode, you may draw an HTML box, and it
will appear not to be opaque. You will see right through it. But
preview in a browser, and you will see that all non-layer HTML boxes
“inherit” the background color of the page itself (by default, this is
white). If you draw such an HTML box over the top of a non-layered
graphic, then the graphic will be sliced into four or more images to
accommodate the HTML item, since the two non-layered elements cannot
overlap except if they are of the same type.

I am not sure if you will see the Overflow property in the Inspector
if you are not drawing a layer. I suspect that you won’t, but I don’t
have Freeway 5 running on this machine at the moment. You might want
to experiment in a new document, so you aren’t thrown by the changes
you will see as you change an element from a non-layered to a layered
element. (This change is non-destructive, but it does throw off the
layer order, leading you to much head-scratching, followed by much
selecting of Move Forward in the main menu.)

Walter

On Mar 4, 2009, at 1:01 PM, Amanda wrote:

If I click the “layer” box for my background psd graphic, then the
rollovers sitting on top of it will disappear.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Wow. Give me a little time to process all that.

Thanks so much for such a comprehensive answer! I’ll do my best to figure it out. (I’m still a bit unfamiliar with a lot of this stuff)


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Wow! Waltd! That is an impressive description of how to build a website. I was cruising the forum to see if someone could cure my messy site and all the problems I was having with layering and interactions, and after reading through this, I went back and rebuilt it according to your descriptions and it now works fine. Thanks so much!

I wish Freeway would include this description in the front of their manual or online in one of their tutorials as it gives the theory behind the practice.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options