Forum Moderators: open

Message Too Old, No Replies

Those Pesky Layers

need help w/ simple but incompatible Layer script...

         

davidbraun

8:52 pm on Feb 13, 2004 (gmt 0)

10+ Year Member



Hello

I've ran into this Platform- / Browser-relevant Pitfall.
Work on a site full of nice, formely not-working stuff (png, css), which is located at [d-ing.net,...] but, of course, I can't get the simplest thing of all to properly work:

the layer-toggle.

I've set up some rather simple js-scripts which use the "getelementbyid()" to toggle .style.visibility, which, on a mac, work on most of every decent, modern browser outthere (netscape, mozilla, omni, safari, ie, opera), but, hey, the monopoly side told me to go back to field one and start over again.

setting up a "document.all" specially and exclusively for the browser called "" doesn't yet seem to work either...

But why is MSIE 5+, which I am told is able to understand "getelementbyid()", reluctant to toggle those layers? What am I doing wrong (besides ignoring the elderly browsers)?

thanks for any help

david

RonPK

11:25 am on Feb 14, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi David, welcome to WebmasterWorld.
Please note that posting URL's pointing to your own site is against this board's TOS [webmasterworld.com].

That being said, the correct syntax for getelementbyid() is getElementById(). Maybe that helps? Otherwise, please post the relevant lines of code.

davidbraun

12:16 pm on Feb 14, 2004 (gmt 0)

10+ Year Member



Hi RonPK

No, the syntax is not the problem. I have it set correctly. Here's the snippets (Since it's a work in Progress again, there are probably awkward lines in it):

// the layer toggle:

function toggle(which, state){
if(document.all) {
state == 'hidden'? eval('document.all["'+which+'"].style.visibility = "hidden"') : eval('document.all["'+which+'"].style.visibility = "visible"');
}
else {document.getElementById(which).style.visibility = state
}
}

// the layer trigger:

function showdetail(which) {
if(detailshowed){toggle(detailshowed,'hidden')}
detailshowed = which
toggle(which,'visible')
}

function shownext(tohide,which) {
toggle(tohide,'hidden') // hide the first argument
if(which) {toggle(which,'visible'); // if there's a second argument, show it - works as a toggle and avoids a layer to stay on stage
detailshowed = which
}
}

========================

in the HTML, there's the following (not working) snippets:

<ul><li><a href="#ipk" onClick="showdetail('ipk'); return false">IPK 1999 -2004</a></li></ul>

<!-- and its target (truncated): -->

<a name="ipk"></a>
<div class="hiddenbox" id="ipk" onClick="shownext(this.id,'ipk2')">
<h2>IPK 1999 - 2004</h2>
</div>

<a name="ipk2"></a>
<div class="hiddenbox" id="ipk" onClick="shownext(this.id')">
<h2>IPK 1999 - 2004</h2>
</div>

When using this state of the stuff in IE (Mac, 5.2.3), the returned msg is

"document.all.ipk.style" is not an object.

Do you have an idea what the problem in the above code-snippets might be?

Thanks very much already

david

(I just went to check what happens if it always goes to document.getElementsById(), and on the mac, and it works - it'll most probably won't do it under Windows... but here I have to find myself a windows-box to really find out...)
===========================================
My Apologies for not having respected the Forums Term of Use (of not pointing to my site). I did it to give an opportunity to see what I'm struggling with and because I did not realize it isn't allowed.

RonPK

8:46 am on Feb 16, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi David,
"document.all.ipk.style" is not an object

For some unexplainable reason IE also returns that error when there is more than one object with the id 'ipk'. You've got two ipk-div's. ID's are supposed to be unique, so maybe it helps if you give all your div's an unique ID?

By the way, why use eval() in the toggle function? It seems harmless but useless to me...

davidbraun

9:47 am on Feb 16, 2004 (gmt 0)

10+ Year Member



Hello RonPK

Thanks very much for hinting me on a typo...

Of course the ids are supposed to be unique - I start with an id='ipk' and then go on counting: #ipk2, #ipk3, etc.

On the page I actually struggle with, the IDs are set correctly, so I don't think that this is the problem... (Just went, and double-checked)

I throwed in the eval() out of pure desperation, and as a kind of a last resort (of my limited knowledge/imagination), just as I throwed in the "if(document.all()"-part.

Isn't MSIE on Windows supposed to support the getElementsById()-method?
Or could there be a conflict with any kind of CSS, or HTML-Formatting causing a script to be not working? - although hard to imagine, you find me clueless about why it doesn't work on Win-boxes...

RonPK

11:00 am on Feb 16, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



MSIE / Win supports getElementById as of version 5. So you only need the document.all stuff if you want to support IE4.
I removed the anchors ( <a name="ipk"></a> ) as their names might conflict with the IDs, and guess what :)

In recent browsers you don't really need them anyway, because an ID can also be used as an anchor.

DrDoc

4:34 pm on Feb 16, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



function toggle(which, state){
if(document.getElementById) {
document.getElementById(which).style.visibility = state;
}
else {
document.all[which].style.visibility = state;
}
}

...should work. Note that you should put the getElementById function FIRST since that is the standard way of accessing elements (even in IE). Also, you should not put quotes around "which" in your document.all call :)

davidbraun

8:37 pm on Feb 16, 2004 (gmt 0)

10+ Year Member



Hello RonPK and DrDoc

Thanks a million for looking into the issue and especially for helping me out of this. Although I remember I was considering the Anchor as a possible issue, I thought 'no, this can't be it' and didn't furrther think about it.

Luckily enough, it (the anchor) made the way into the forum. I'd have stared at the code for ages without getting it, I guess!

Now I can go on with my little adventure of 'replacing flash' (or so)

Again, accept all my respect and gratefulness...

david