[JS] Divs not showing
[EDIT]Looking at it, when you click the Update one it works fine. But Features does not...[/EDIT]
I have a javascript that displays a set of Divs if they are hidden and hides them if they are visible. Unfortunatley, when the javascript is run the divs are moved alright but they are invisible. To see what I mean, go to http://www.logsdon.org/xjamesx/at/56k and click on either Features or Updates (with the Plus signs next to them). See how blank space appears but nothing else? That's supposed to be three seperate Divs nested in a container Div.
Javascript:
function ShowHide(id) {
if (document.all(id).style.position == "absolute") {
document.images("IMG_"+id).src = "../images/minus1.gif";
document.all(id).style.position = "relative";
document.all(id).style.top = "0px";
document.all(id).style.display = "";
} else {
document.all(id).style.position = "absolute";
document.all(id).style.top = "-1000px";
document.all(id).style.display = "none";
document.images("IMG_"+id).src = "../images/plus1.gif";
}
}This is probably not the best code right now, but I do my coding weird (at least I think I do). I get it working in the browser I use the most (unfortunatley), IE6. Then I get it to work in other browsers. Its just easier for me to do since my dad has it set so I can't install anything .
Any help you could provide would be GREATLY appreciated.
Thanks,
necrotic
P.S. The vB3 is nice
[James Logsdon]
kb posted this at 01:20 — 20th November 2003.
He has: 1,380 posts
Joined: Feb 2002
i don't see anything wrong (WinXP, IE)
necrotic posted this at 01:23 — 20th November 2003.
He has: 296 posts
Joined: May 2002
That's what happens. What version of IE?
druagord posted this at 02:01 — 20th November 2003.
He has: 335 posts
Joined: May 2003
you should use getelementbyid for that kind of things (it would work in IE and other browser) try to use visibility instead of display parameters are visible or hidden
IF , ELSE , WHILE isn't that what life is all about
Abhishek Reddy posted this at 02:25 — 20th November 2003.
He has: 3,348 posts
Joined: Jul 2001
<?php<script type=\"text/javascript\">
<!--
function ShowHide(id) {
if (document.getElementById(id).style.position == \"absolute\") {
document.getElementById(\"IMG_\"+id).style.src = \"images/minus1.gif\";
document.getElementById(id).style.position = \"relative\";
document.getElementById(id).style.top = \"0px\";
document.getElementById(id).style.display = \"block\";
} else {
document.getElementById(id).style.position = \"absolute\";
document.getElementById(id).style.top = \"-1000px\";
document.getElementById(id).style.display = \"none\";
document.getElementById(\"IMG_\"+id).style.src = \"images/plus1.gif\";
}
}
-->
</script>
?>
Works in Mozilla Firebird. To make life a little easier, you might want to code to xhtml strict or transitional. Helps with the DOM sometimes. Also use & copy ; instead of the copyright character at the bottom.
Oh, and change paths to suit.
necrotic posted this at 02:37 — 20th November 2003.
He has: 296 posts
Joined: May 2002
Already is & copy ;.
I'll try that code, thanks.
[James Logsdon]
Abhishek Reddy posted this at 06:47 — 20th November 2003.
He has: 3,348 posts
Joined: Jul 2001
It's already & copy ;? That means my editor is parsing HTML character code. Or maybe it was Mozilla while saving the page. Sorry about that.
Tell me if that code works right in IE. I have no idea what IE's support of DOM/ECMA standards is like anymore.
necrotic posted this at 00:57 — 21st November 2003.
He has: 296 posts
Joined: May 2002
It works in IE, but the same problem exists. I'd look at it closer, but I have to do a project for school now. It's a large one, too. Doing a pixel art of a Manor from Medieval Times. Fun stuff, but hard. Thanks for the help.
[James Logsdon]
Abhishek Reddy posted this at 03:22 — 21st November 2003.
He has: 3,348 posts
Joined: Jul 2001
It works in Mozilla Firebird 0.7 on Linux. Only think is that the images don't change, but that's because you haven't altered the paths for your own filing structure. What browers does it fail in?
Good luck on that project, sounds like a lot of work.
necrotic posted this at 17:04 — 22nd November 2003.
He has: 296 posts
Joined: May 2002
Actually, I did change the path to ../images/. Strange stuff.
In opera 6 it doesn't work at all. IE the same problem exists. Mozilla it works fine. What I'll probably end up doing is having the javascript only on Mozilla. For IE and Opera it'll just be automatically opened (PHP most likely, I'm better at that).
Thanks for the help Abhishek!
[James Logsdon]
Abhishek Reddy posted this at 01:03 — 23rd November 2003.
He has: 3,348 posts
Joined: Jul 2001
Check this out.
necrotic posted this at 03:18 — 23rd November 2003.
He has: 296 posts
Joined: May 2002
Wow, that's great! Thanks so much Abhi!
Abhishek Reddy posted this at 04:54 — 23rd November 2003.
He has: 3,348 posts
Joined: Jul 2001
No problems. It's pretty much what you had before, but without the frills. Sometimes we complicate things too much. Took me a while to realise that I was overlooking the positioning bit.
necrotic posted this at 19:48 — 23rd November 2003.
He has: 296 posts
Joined: May 2002
I forgot that display: none made it actually display nothing. I'm used to visibility: hidden which just hides it and still keeps the spacing. Thanks again.
[James Logsdon]
Vincent Puglia posted this at 01:42 — 26th November 2003.
They have: 634 posts
Joined: Dec 1999
Hi,
if you send a boolean along with the id, you can simplify the code even further:
function ShowHide(divID, showIt )
{
document.getElementById("IMG_"+divID).style.src = (showIt) ? "images/minus1.gif" : "images/plus1.gif";
document.getElementById(divID).style.display = (showIt) ? "block" : "none";
}
Vinny
Where the world once stood
the blades of grass cut me still
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.