...

View Full Version : CSS watermark



Grant Palin
10-26-2002, 04:30 AM
How do you create a watermark background using CSS? I've seen it done, though I don't remember where. I mean, it's a light-colored background image that doesn't tile, remains fixed, and merges neatly with a set background color.

cg9com
10-26-2002, 05:23 AM
http://www.dynamicdrive.com/dynamicindex3/fixback.htm

Grant Palin
10-26-2002, 06:03 AM
Thanks, but I figured it out using just CSS.

cg9com
10-26-2002, 07:45 AM
Thats the reason i gave you the link

you can take
url('notebook.jpg') white center no-repeat fixed
out of that script and use it in CSS

Grant Palin
10-26-2002, 05:38 PM
Hmmm...I didn't know that. I don't know DHTML, so I couldn't remove any of the script while being sure it would still work. By the way, what does the rest of the script DO? What's the point?

cg9com
10-27-2002, 04:16 AM
things like
if (document.all
will display the watermark only if the page is being viewed in internet explorer, and something i just learned, opera as well :(

Grant Palin
10-27-2002, 04:52 AM
So, like I asked, is it important? Does it really have to be there?

cg9com
10-27-2002, 06:20 AM
yes, it should be in javascript with the browser recognition.
in simple CSS it could cause problems with other browsers, however if you know the site will be viewed only in say IE then it can be used in just CSS

Grant Palin
10-27-2002, 06:44 AM
Why would it only work in Internet Explorer if it was just CSS?

cg9com
10-27-2002, 07:03 AM
there is plenty of CSS that will only work in IE, that browser will use just about anything you type. hehe
another example would be maybe (overflow:hidden)
and user colored scrollbars
i cant think of any tutorial websites that may help you understand more.
but here are a few off the top of my head that could have some information on further questions.

http://www.javascriptkit.com
http://www.htmlgoodies.com
http://www.w3schools.com

Grant Palin
10-27-2002, 08:37 PM
So I guess I'll have to put that bit of code into every one of my pages then...Sigh...

joh6nn
10-27-2002, 09:23 PM
um.

both background, and overflow, are standard, and not IE proprietary.

Grant, i'm not really sure why that snippet of code exists at all. supposedly, it would make the css fail gracefully in browsers that don't support it. except that css does that anyway, without the help of javascript.

a good resource to see what works where is : http://www.xs4all.nl/~ppk/css2tests/intro.html

Grant Palin
10-27-2002, 11:15 PM
So, I don't need to worry about that at all then?

joh6nn
10-27-2002, 11:49 PM
no, you shouldn't need to worry about it.

Grant Palin
10-28-2002, 12:06 AM
Phew! You've just saved me a lot of work- I have almost 50 pages in my site, and it would have been a hassle to have to add that javascript to every one of my pages. Thanks a lot!

cg9com
10-28-2002, 12:29 AM
without the javascript i got errors in opera

joh6nn
10-28-2002, 01:32 AM
you got errors, or it just didn't work?

Grant Palin
10-28-2002, 02:22 AM
Please visit my site and tell me how it looks with the static watermark, and whether it works or not.

http://www.freewebs.com/hommworld/Homm2/Index.html

joh6nn
10-28-2002, 05:04 AM
working fine for me in opera 6.05, IE6 SP1, and Moz 1.1 in NS4, it shows up, but it's up in the corner, and it scrolls. to see how you might fix that, check this out: http://www.evolt.org/article/Assigning_browser_specific_styles/17/14732/index.html

cg9com
10-28-2002, 05:26 AM
without javascript (opera 6.05 )
i got an error, it was confusing the browser i think, something about printing the page, and i rechecked, every time i opened it, it happened.

btw neat site Grant Palin

Grant Palin
10-28-2002, 06:37 AM
Thanks for that link, joh6nn. That was interesting. What you're saying is I should set aside a portion of the stylesheet specifically for Netscape browsers, and change the settings accordingly? Is that it?

cg9com- you got an error whenever visiting my page? What was the error? And thanks for the compliment!

joh6nn
10-28-2002, 06:54 AM
grant, the technique laid out in that article ( assuming i linked to the right one ) is more or less setting up two style sheets. NS4 doesn't understand the @import rule for style sheets, while almost every other browser does. so, it will skip over that rule, and use the first style sheet, and all the other browsers will use the second style sheet.

Grant Palin
10-29-2002, 03:28 AM
So, generally speaking, what I should do is create a second style sheet, linked from the first, containing all the "regular" CSS. The first style sheet should contain the Netscape-specific styles. If using some other browser than Netscape, the second sheet overrides the first. How am I doing?

cg9com
10-29-2002, 03:50 AM
Originally posted by Grant Palin
cg9com- you got an error whenever visiting my page? What was the error? And thanks for the compliment!

No i got an error when i loaded a local .html file i made, and opened with opera.

Your welcome :)

Grant Palin
10-29-2002, 06:28 AM
Whew! You had me going for a minute there!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum