[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 221
  • Last Modified:

Layer color change?

Is it possible to change layer color?
Here is un unsuccessful attempt:
<html>
<head>

<STYLE TYPE="text/css">
<!--
  #Layer1 {position:absolute; left: 80; top:40;}
-->
</STYLE>


<script language="javascript">
<!--

var NS = (document.layers)? true:false
var m211= '#FF6633';
var Layer1 = "<div id='Layer1' CLASS=Layer1 style='position:absolute; width:200px; height:115px; z-index:100; background-color: "+m211+"; layer-background-color: "+m211+"; border: 1px none #000000; left: leftp; top: 211px'></div>";


function writeM(container,text)
{
      if (NS)
    {
            var objw = document.layers[container].document
            objw.open();
            objw.write(text);
            objw.close();
      }
      else document.all[container].innerHTML = text;
}

function Show()
{
    writeM('Layer1',Layer1);
}


function colC(m)
{
    m211= '#FF6633';
    writeM('Layer1',Layer1);
}

//-->
</script>
</head>


<body text="#FFFF00" bgcolor="#000000" link="#6633FF" vlink="#FFFF00"
alink="#99FFFF" onload="Show()">

<A HREF="javascript:void(0)"  onMouseDown="colC()">CHANGE COLOR</A>

<div id="Layer1" CLASS=Layer1></div>

</body>
</html>
0
BartS
Asked:
BartS
1 Solution
 
pappalaCommented:
what exactly do you need, do you want the existing code to be changed or need another code that will workout the problem
0
 
brigmarCommented:
BartS,

just at a glance....

You're changing m211 from '#ff6633' TO '#ff6633', so even if the rest would work, there is no change.

When you "change" m211, you don't re-evaluating Layer1, so it will always contain the original content.

You're using document.all['Layer1'] in the IE version, and then setting the innerHTML of Layer1 to contain a DIV also called Layer1

I've modified your code and it now works in IE4+/NN4+


<html>
  <head>
<STYLE TYPE="text/css">
<!--
#Layer1 {position:absolute; left: 80; top:40;}
-->
</STYLE>
<script language="javascript">
<!--
var NS = (document.layers)? true:false

var m211= '#FF6633';
var Layer2_1 = "<div id='Layer2' style='position:absolute; width:200px; height:115px; z-index:100; background-color: "+m211+"; layer-background-color: "+m211+"; border: 1px none #000000; left: leftp; top: 211px'></div>";
var m212= '#FF9999';
var Layer2_2 = "<div id='Layer2' style='position:absolute; width:200px; height:115px; z-index:100; background-color: "+m212+"; layer-background-color: "+m212+"; border: 1px none #000000; left: leftp; top: 211px'></div>";

function writeM(container,text)
{
  if (NS)
  {
    var objw = document.layers[container].document
    objw.open();
    objw.write(text);
    objw.close();
  }
  else document.all[container].innerHTML = text;
}
function Show()
{
  writeM('Layer1',Layer2_1);
}
function colC(m)
{
  writeM('Layer1',Layer2_2);
}
//-->
</script>
  </head>
  <body text="#FFFF00" bgcolor="#000000" link="#6633FF" vlink="#FFFF00"
        alink="#99FFFF" onload="Show()">
    <A HREF="javascript:void(0)" onMouseDown="colC()">CHANGE COLOR</A>
    <div id="Layer1" CLASS=Layer1>
    </div>
  </body>
</html>


HTH
Brian
0
 
abarr100999Commented:
It's been my experience that NS4 responds better to JavaScript StyleSheets than standard CSS.

<STYLE TYPE="text/javascript">
classes.layer1.backgroundColor("white")
</STYLE>

and then reassign a backgroundColor value as desired within another function.


Hope this helps.
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
brigmarCommented:
surely that's a comment, not an answer ??
0
 
brigmarCommented:
BartS

Have you tried the solutions presented ?

Brian
0
 
BartSAuthor Commented:
I haven't completely tried to implement your idea, ABARR, although it may work.

Brian's answer is working very well. Brian, please resend your answer so that I can send you your points.

Thank you very much everyone!
0
 
BartSAuthor Commented:
I just found out how to accept your answer. Thanks.
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now