Help With Toggle HTML Code Options

[coinman9388]

After the text, I wrote a line of code to close the display, but it won't work. The same code worked for the "Jungle" code, but not the "Base Set" code.
Web Page: http://www.brentscardsandcoins.com/price-guide.php

Base Set Code

<script type="text/javascript">
function toggle(obj) {
var obj=document.getElementById(obj);
if (obj.style.display == "block") obj.style.display = "none";
else obj.style.display = "block";
}
</script>

<a href="java script: void(0);" onClick="toggle('q1')"><font size=6 color="red">Base Set</font></a>
<div id="q1" style="display:none;">
<hr>
<br>


(About 600 lines of code for text that I assume you don't want to read)


<a href="java script: void(0);" onClick="toggle('q1')"><font size=6 color="red">Close Base Set</font></a>
</div>

Jungle Code

<a href="java script: void(0);" onClick="toggle('q1')"><font size=6 color="red">Close Base Set</font></a>
</div>
<br><br>
<a href="java script: void(0);" onClick="toggle('q2')"><font size=6 color="red">Jungle</font></a>
<div id="q2" style="display:none;">

(Several lines of code for text that I assume you don't want to read)

<a href="java script: void(0);" onClick="toggle('q2')"><font size=6 color="red">Fossil</font></a>
<div id="q2" style="display:none;"><br>

[pandy]

Both work for me. Did you fix it already?

[coinman9388]

Both work for me. Did you fix it already?

It looks like it is only not working on FireFox. I have also notices some of my horizontal rules aren't showing up on FireFox either. Worked fine on edge. Maybe I should download chrome too.

Any ideas why it might not work on FireFox?

[pandy]

Works in FF too for me. But I don't think I have the latest version, 40.0.03.

[CharlesEF]

What doesn't work in FF v42 is the 'Close Base Set' at the end. It doesn't even look like a link. I see several extra tags so you should use a validator (I did and got 2008 errors). This site has one, the link is shown at the bottom of every page

[pandy]

Ack, as usual I didn't notice. You have an extra empty DIV with the ID q1. Alas removing that doesn't help, but do it anyway. There can only be one instance of an ID and JavaScript will only recognize one of them. I think this is an HTML error, a missing or extra quote somewhere.

[pandy]

Well, it has to do with the PRE tags, but I can't figure out exactly how.

PRE has a mandatory closing tag that you leave out. See http://htmlhelp.com/reference/html40/block/pre.html . If I remove all PRE tags the close link becomes a link and works. Maybe adding closing tags would have the same effect, but that would be too much work so I'm not going to try. I can also get it to work by commenting out different large blocks of the Base list but I see no system in it.

When you leave PRE open like that you could end up with the link being contained in PRE. That explains the font, but not why it isn't a link and why the JS doesn't work. Links are allowed inside PRE. So there is something more.

Problem is you have an enormous amount of syntax errors. The validator chokes on the page. To figure out the real problem the page would need to be cleaned up and, again, that's too much work for me. You should do that though. It would probably solve this problem and it would definitely solve other potential problems you may otherwise encounter with the page.

http://htmlhelp.com/cgi-bin/validate.cgi?u...s&input=yes

[pandy]

As a starting point, change to the HTML 4.01 Transitional doctype, remove all XHTML closing slashes and the xmlns declaration in the HTML tag. You don't use XHTML consistently and XHTML is a dead end anyway, just extra bytes that you can just as well be without. That will get the errors down a little and make the validator result easer to sift through.