Senior Member
Join Date: Jun 2004
Location: Columbus, Georgia
|
I am trying to use JavaScript to alternate the visibility of two divs on my pages. So far i have this code,
Code:
<script language="JavaScript">
function toggleVisibility(hide, show){
show.style.visibility="visible";
hide.style.visibility="hidden";
}
function hideOnLoad(hide){
hide.style.visibility="hidden";
}
</script> I have two images one named Artifact 1 and the other Artifact 2. When I click them I want them to show the appropriate div, "Artifact 1" or "Artifact 2."So I have this in the HTML, Code:
<td width="340"><img style="border:0px" src="images/artifact1_172_74.png" alt="" width="172" height="74" onclick="toggleVisibility(Artifact2,Artifact1)"/></td>
<td width="340"><img style="border:0px" src="images/artifact2_172_74.png" alt="" width="172" height="74" onclick="toggleVisibility(Artifact1,Artifact2)"/></td> It works in IE and Safari, but not FireFox. Is there anything I am missing. I know nothing about JavaScript and I pieced this together on a trial and error type learning experience.One of the pages this is on is Performace Standard 7 if you check with FireFox or Camino it does not work, Safari does. What Adobe Updater‽ What‽ What‽ WHAT‽ |
quote |
‽
|
I assume "Artifact1" and "Artifact2" are the ids of the two divs?
Seems it should work better if you change it to this: Code:
function toggleVisibility(hide, show){
document.getElementById(show).style.visibility="visible";
document.getElementById(hide).style.visibility="hidden";
}
function hideOnLoad(hide){
document.getElementById(hide).style.visibility="hidden";
} |
quote |
‽
|
Also, change all references to use quotes (single or double):
Code:
<body onload="hideOnLoad('Artifact1'); hideOnLoad('Artifact2')"> andCode:
<td width="340"><img style="border: 0px none ;" src="ps7_files/artifact1_172_74.png" alt="" onclick="toggleVisibility('Artifact2','Artifact1')" height="74" width="172"></td>
<td width="340"><img style="border: 0px none ;" src="ps7_files/artifact2_172_74.png" alt="" onclick="toggleVisibility('Artifact1','Artifact2')" height="74" width="172"></td> |
quote |
Senior Member
Join Date: Jun 2004
Location: Columbus, Georgia
|
Thanks chucker, its working after seeing your follow up post.
|
quote |
Senior Member
Join Date: Jun 2004
Location: Columbus, Georgia
|
Does any one know how I can include another html file within another using javascript.
The page has to be able to run off of a disk I turn in, will SSI run or does the page acutally need to be being served off a server to get SSI to work? What Adobe Updater‽ What‽ What‽ WHAT‽ |
quote |
‽
|
SSI means "server-side includes", which, y'know, should answer your question
You could use JavaScript in conjunction with, say, document.write, and insert code that way. |
quote |
Senior Member
Join Date: Jun 2004
Location: Columbus, Georgia
|
Yeah, I thought so. Doesn't hurt to ask though. Off to look up document.write .
|
quote |
Member
Join Date: Oct 2004
Location: Minneapolis, MN
|
Do you want to insert a new document from a separate file?
document.write is a rather clumsy way of doing things. The way I'd go is to use XMLHttpRequest to grab the file and insert it into the contents of your page. It's all the rage with web developers now, and it's a pretty convenient thing to know. Here's Apple's docs on it - the only caveat is that the file must be on the same domain as the page that's calling it. It's a little more complex code, but it's also more useful than trying to use document.write to throw more code on a page. |
quote |
‽
|
Not to mention document.write is also impossible on (proper) XHTML.
|
quote |
Posting Rules | Navigation |
|
Thread Tools | |