HTML authoring - fixed background images

Author

fixed background images

Bier de Stone

2005-05-21, 7:25 pm

I`m trying to figure out how to create a fixed image on my page that
doesn`t move when the scroll bar is moved. This is what my html source
code looks like for the image

<body background="image.gif">

Does it matter whether I use a .jpg or .gif image? How can I make an
image stationary in the page?

--
\ /
Â¶
â„ \
COMING SOON blog <http://r.aguirre.home.att.net/reversepilcrow.html>

Els

2005-05-21, 7:25 pm

Bier de Stone wrote:

> I`m trying to figure out how to create a fixed image on my page that
> doesn`t move when the scroll bar is moved. This is what my html source
> code looks like for the image
>
> <body background="image.gif">
>
> Does it matter whether I use a .jpg or .gif image? How can I make an
> image stationary in the page?

I only know how to do it with CSS:
<body
style="background-image:url(image.gif);background-attachment:fixed;">

or better:
<body>
and in the <head> of your file:
<style type="text/css">
body{
background-image:url(image.gif);
background-attachment:fixed;
}
</style>

You can also position it, and decide whether you want it to repeat
when the window is larger than the image:
background-position:left center;(or center, or center top, center
bottom, right center, right top, left bottom ...)
background-repeat:no-repeat;(or repeat-x, repeat-y, or repeat)

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Stealers Wheel - Stuck In The Middle

Elephant

2005-05-22, 7:28 pm

Bier de Stone wrote:
>
> I`m trying to figure out how to create a fixed image on my page that
> doesn`t move when the scroll bar is moved. This is what my html source
> code looks like for the image
>
> <body background="image.gif">

Here's what I use on my web page. gif or jpg does not matter.

<BODY bgProperties=fixed BACKGROUND="clouds.jpg">

Let me know if it works for you.

Adrienne

2005-05-23, 4:22 am

Gazing into my crystal ball I observed Elephant <elephant@the-zoo.com>
writing in news:4290A674.1345@the-zoo.com:

> Bier de Stone wrote:
>
> Here's what I use on my web page. gif or jpg does not matter.
>
> <BODY bgProperties=fixed BACKGROUND="clouds.jpg">
>
> Let me know if it works for you.
>

Background for the Body element is deprecated for HTML 4.01, as is
bgProperties. Use css:
Body {background-image:url("clouds.jpg"); background-attachement: fixed}

One of the good things about using an external stylesheet is that if you
get tired of that background, you don't have to go into many, many pages
and change the markup. Just one change in the CSS file changes ALL pages.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

Bier de Stone

2005-05-29, 4:27 am

Adrienne wrote:

>Gazing into my crystal ball I observed Elephant <elephant@the-zoo.com>
>writing in news:4290A674.1345@the-zoo.com:
>
>
>
>
>Background for the Body element is deprecated for HTML 4.01, as is
>bgProperties. Use css:
>Body {background-image:url("clouds.jpg"); background-attachement: fixed}
>
>One of the good things about using an external stylesheet is that if you
>get tired of that background, you don't have to go into many, many pages
>and change the markup. Just one change in the CSS file changes ALL pages.
>
>
>
Thanks for the tip. I`ll keep in mind that css is the way to go. Does
anybody have a clue to the image size that would best fit a browser
window (without image repetition)? I don`t have my image yet, but I have
visions of framing the outer edges of the browser window with a snake,
a.k.a. Ourobouros. I know that this symbol normally should be in the
shape of a circle and I am crossing my fingers that I`m not the target
of any mysterious organizations that may take offense of my distortion,
but as it goes, I may be inclined to maintain aspect ratios and all of
that to enforce the ideological sense this symbol may convey with a
cycle. I guess an oval snake eating it`s own tail is better than a
square one.

--

\ /
¶
/ \
"Backward ideas" http://r.aguirre.home.att.net

Adrienne

2005-05-29, 4:27 am

Gazing into my crystal ball I observed Bier de Stone <artworld@att.net>
writing in news:42996171.6010409@att.net:

> Thanks for the tip. I`ll keep in mind that css is the way to go. Does
> anybody have a clue to the image size that would best fit a browser
> window (without image repetition)?

You really don't want to do this. In order to do so, you would have to do
some client side javascript available height/width sniffing, and present an
image close to that size, so you might have to have many images. Not a
good idea.

Better would be to make one image and center it with no repeat. Make it
like a watermark, and make sure that text can be read over it.

Of course, you could hold your legs together and wait for CSS3
<http://www.w3.org/TR/2005/WD-css3-b...the-background-
size> where the background-size property will do just what you want.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share