Hi,
I'm having some trouble with a page I'm working on, and seeing the same thing in FF and IE ( 7 ), which means it's my fault. I'm starting to experiment with collapsible sections on some of my pages, sort of like nodes in a tree. It will definitely help people reading some of my articles, so I'm trying to figure out the best way to implement this. But javascript is my weak point.
My test page so far has been
http://seattle-portraits.com/Tips.html
The first handful of sections get their own function, which is repetitive and just pointless. The last section (
location ) I'm tackling in a more generic way. Instead of hard coding IDs into DOM calls, I'm passing "this" as a parameter. In other words, from
function toggleMakeupSection() {
var a = document.getElementById("secMakeup");
to
function toggleSection(a, sectionDivID) {
When I make the change, this next bit stops working
if(a.innerHTML == "-") {
a.innerHTML = "+";
there's more, but that's the gist of it. When "a" is a locally declared variable that I look up with document.getElementById, I'm able to change the +/- symbol and things work the first time. The html is
<h2>[<a href="javascript
:toggleSection(this, 'locationSection')" id="secLocation" style="color:red; font-weight:bold;" title="Click to hide">-</a>] Location</h2>
I can get it to work by passing the ID of the a element as a string instead, but there would be less maintenance overall if I could just pass the element as "this" and worse, I don't understand why that isn't working?
So ... can anybody give me any advice on this one?
