Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

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

Javascript IE4 and Nav Layers

I have the following script -

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <script language="JavaScript">
<!--
function alter(){
document.layers["Layer1"].src="Images/TagLines/01in.gif"; width="240"; height="358"
}
//-->
</script>
</head>

<body bgcolor="#FFFFFF">

<div id="Layer1" style="position:absolute; left:159px; top:93px; width:246px; height:317px; z-index:1"><img src="Images/TagLines/02in.gif" width="240" height="358"></div>

<div id="Layer2" style="position:absolute; left:160px; top:20px; width:132px; height:57px; z-index:2">

<form method="post" action=""><input type="button" name="button" value="Change" onClick="alter()"></form>

</div>

</body>
</html>

This works great in Navigator but IE4 says document.layers
.Layers1 is not an object.

I want to alter the image source for a layer in both Nav
and IE4. How can I do this ?
0
MoonlightMedia
Asked:
MoonlightMedia
  • 2
1 Solution
 
ddoyleCommented:
Add this code to the top of your file

<script language="JavaScript1.2">

   if (document.layers) {n=1;ie=0}
   if (document.all) {n=0;ie=1}

   if (n) mylayer = document.layers1
   if (ie) mylayer = Layers1.style

</script>


Then, further down in your code you can do something like this:

<div ID=mylayer>
.
</div>

<script language="JavaScript1.2">
if (n) {
mylayer.visibility = "hide";
}
if (ie) {
mylayer.visibility = "hidden";
}
</script>

0
 
MoonlightMediaAuthor Commented:
 Although this may allow me to reference the layer, it does not allow me to
alter the source image of the layer which you can see by the script is the
original intent. Just hiding the layer isn't a solution for what I need.
  The full implimentation of the script will cause the source image of the layer
to be altered dependant on the selected index of a list box. I have this running
completely in Netscape.
  From your answer, it looks as if I should do some reading regarding style sheets.
Is this a correct assumption ? Could you please explain the reference
" mylayer=Layers1.style ".
0
 
ddoyleCommented:
As I thought I illustrated in the example provided, the object models differ from Netscape to IE.  You should be able to put your code into a function like so.

<script language="JavaScript1.2">

function alter(){
   if (document.layers) {n=1;ie=0}
   if (document.all) {n=0;ie=1}

   if (n){
      document.layers1["Layer1"].src="Images/TagLines/01in.gif";
    }
   if (ie) document.images("MyImage").src="xxx.gif";
}
</script>

Assuming the body looks something like this:
<body bgcolor="#FFFFFF">

<div id="Layer1" style="position:absolute; left:159px; top:93px; width:246px; height:317px; z-index:1"><img ID="MyImage" src="Images/TagLines/02in.gif" width="240" height="358"></div>

<div id="Layer2" style="position:absolute; left:160px; top:20px; width:132px; height:57px; z-index:2">


This has nothing to do with Style Sheets, but everything to do with the DHTML object model.  So, you should read up on DHTML.  I would not get one of those books which just devote a chapter or so to it.  I would get a book on specifically DHTML if you really want to learn it.

0

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

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