Using Water45marks with bg Colours

**Paul Clarke** · 01-23-2008, 12:08 AM

Hi Guys,

I'm using a DD sceipt (http://www.dynamicdrive.com/dynamicindex3/fixback.htm) which puts a watermark behind the text in a web page. The proplem is that if I try to chang the background colour in page properties, it stops the watermark effect from working.

The site is stilll work in progress buy can be viewed on www.hobbyharmproduce.com.

Any help would be greatly appreciated,

Paul

**Nile** · 01-23-2008, 12:29 AM

The reason why its not working is because all there doing is really this in CSS:

Code:

body {
background: url('address_to_image') no-repeat fixed;
}

So there not really doing anything, all there doing is getting a image thats got opacity, for a real gradient background check this out:

Code:

body{
background: url('address_to_image') no-repeat fixed'
filter: alpha(opacity=60);
opacity: 0.6;}

And that dhould work just fine,

**Paul Clarke** · 01-23-2008, 12:39 AM

WOW that was quick. I'll give that a shot.

Thabnks for your time and advice,

Paul

**Nile** · 01-23-2008, 12:47 AM

Ok, tell me if it works.

**Paul Clarke** · 01-23-2008, 01:07 AM

Tried that and added "<body{
bgcolor="#00FF00":background: url('images/hands1.gif') no-repeat fixed'
filter: alpha(opacity=60);
opacity: 0.6;}>"to give backgroun colour.
The watermark is stil there buy still mo bg colour. I must be making a simoke mistake if there is no conflict.

Thanks again

Paul

<body{
bgcolor="#00FF00":background: url('images/hands1.gif') no-repeat fixed'
filter: alpha(opacity=60);
opacity: 0.6;}>

**Nile** · 01-23-2008, 01:46 AM

No, your doing it wrong.
At the top of your page add this(in your head tag):

Code:

<style type="text/css">
body{
bgcolor="#00FF00":background: url('images/hands1.gif') no-repeat fixed'
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>

Leave the <body> tag alone.

**Paul Clarke** · 02-03-2008, 03:19 PM

Hi Nile,

Thanks for all yur help. Tried that, still got the background hand but the bgcolour is still white.

Thanks...

Paul

**thetestingsite** · 02-03-2008, 03:22 PM

The style should be like this:

Code:

<style type="text/css">
body{
background: #00FF00 url('images/hands1.gif') no-repeat fixed';
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>

Hope this helps.

**Paul Clarke** · 02-03-2008, 06:09 PM

Tried the above code guys. I still get the hands but no background colour. The page I am using for teesting is home.html, the main frame in http://www.hobbyfarmproduce.com/sunflower/index.html

Copy of code below

Code:

<html>
<head>

<style type="text/css">
body{
bgcolor="#00FF00":background: url('images/hands1.gif') no-repeat fixed'
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>


<style type="text/css">
body{
background: #00FF00 url('images/hands1.gif') no-repeat fixed';
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>


<script type="text/javascript" src="textsizer.js">

/***********************************************
* Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
* Coded by: Taewook Kang (http://www.txkang.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<title>Home Page</title>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<base target="main">

</head>

style type="text/css">
body{
background: #00FF00 url('images/hands1.gif') no-repeat fixed';
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>

Thanks for all your help guys - much appreciated

Paul

**thetestingsite** · 02-03-2008, 06:30 PM

It should just be like so:

Code:

<html>
<head>

<style type="text/css">
body{
 background: #00FF00 url('images/hands1.gif') no-repeat fixed';
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>


<script type="text/javascript" src="textsizer.js">

/***********************************************
* Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
* Coded by: Taewook Kang (http://www.txkang.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<title>Home Page</title>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<base target="main">
</head>
<body>
 CONTENT
</body>
</html>

After looking at home.html at the url you posted, it appears that your code is nothing like the above. What you have on home.html should be replaced with the following:

Code:

<html>
<head>
<title>Home Page</title>
<script type="text/javascript" src="textsizer.js">

/***********************************************
* Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
* Coded by: Taewook Kang (http://www.txkang.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

<style type="text/css">
body{
background: #00FF00 url('images/hands.gif') no-repeat fixed';
filter: alpha(opacity=60);
opacity: 0.6;
}
</style>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<base target="main">
</head>
<body>
<table border="0" width="100%" height="229" cellspacing="0" cellpadding="0">
  <tr>

    <td width="24%" height="223"><img border="0" src="images/CORNERSUNFLOWER.gif" width="231" height="231"></td>
    <td width="52%" height="223">
      <h1 align="center"><font size="7" color="#00FF00"> </font><a href="javascript:ts('body',1)">+ 
        Larger Font</a> | <a href="javascript:ts('body',-1)">+ Smaller Font</a> 
      </h1>
      <p align="center">
        <script language="Javascript">  
var NS = (navigator.appName == "Netscape");
var VERSION = parseInt(navigator.appVersion);
if (VERSION > 3) {
    document.write('<form><input type=button value="Print this Page" name="Print" onClick="printit()"></form>');        
}
</script>

    </td>
    <td width="24%" height="223">
      <p align="right"><img border="0" src="images/CORNERSUNFLOWER2.gif" align="right" width="231" height="231"></td>
  </tr>
</table>
<h3 align="center"><font color="#000080" size="6">Welcome to Mayo Roscommon Hospice
Website</font></h3>
<p align="center"><font color="#0000FF">The Mayo Roscommon Hospice Foundation is
a voluntary charitable organization which was set up in 1992 to provide a
Palliative Care service for patients with life threatening illness in counties
Mayo and Roscommon</font></p>
<h3 align="center"><font color="#000080">The Foundation's Mission Statement</font></h3>
<p><font color="#0000FF">&quot;Mayo/Roscommon Hospice Foundation affirms life. Respecting the
uniqueness of each individual, caring and supporting to meet the physical,
emotional and spiritual needs of patients and their families living with life
threatening illnesses.<a href="http://www.hospice.ie/sun.htm"><img src="IMAGES/SUNFLOWERS.GIF" align="right" border="0"></a></font></p>

<p><font color="#0000FF">We invite you to browse our Website to learn more about Mayo Roscommon
Hospice and the services offered by our Foundation.&quot;</font></p>
<p><font color="#0000FF">Cynthia Clampett<br>
Chief Executive</font></p>
<p>&nbsp;</p>
<p><font color="#0000FF">You can help Mayo Roscommon Hospice Foundation to
provide a Palliative care service in Counties Mayo and Roscommon by joining your
local Hospice Support Group, taking part in one of our many Fundraising Events
or by making a Donation</font></p>
<p align="center"><font color="#0000FF">This site is intended for people
suffering long term pain who need respite / palliative care, for those who are
coming to the end of their lives and for their carers.&nbsp; It is not intended
to be a complete guide to Hospice care.&nbsp; Your first point of call should be
your GP.</font></p>
<p align="center"></p>
<p align="center"><font color="#000000" size="5"><b>Hospice is about life and 
  living<br>

  Hospice care is about quality of life</b></font></p>
<p></p>
<p><br>
</p>
<p></p>
<p align="center"><font color="#FF0000"><br>
  </font></p>
<p align="center"></p>
<p align="center">&nbsp;</p>
<p align="center"><font color="#FF0000"><br>
  </font></p>
<p align="center"></p>
<p>&nbsp;</p>

</body>
</html>

Hope this helps.

Thread: Using Water45marks with bg Colours

Thread Tools

Search Thread

Using Water45marks with bg Colours

http://www.dynamicdrive.com/dynamicindex3/fixback.htm

The Following User Says Thank You to thetestingsite For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions