A call for help! – Eclecticism

This entry was published at least two years ago (originally posted on January 11, 2003). Since that time the information may have become outdated or my beliefs may have changed (in general, assume a more open and liberal current viewpoint). A fuller disclaimer is available.

I’m using a fairly heavily adapted version of the Hide/Show Comments hack from Scriptygoddess to hide and show the clickable smileys I’ve added to my site. I simplified the javascript a lot, but in doing so, the ‘hide/show smileys’ links on any post in my blog only work under Internet Explorer, and fail in various ways in any other browser (Netscape/Mozilla/Chimera don’t seem to be recognizing the javascript, and just reload the page, and Safari (and therefore probably also Konqueror, since they both use the kHTML rendering engine) doesn’t even display the links!).

Could anyone possibly give me some help on getting these to at least work under both IE and Netscape/Mozilla/Chimera, if not Safari also? I don’t know enough about javascript to know how to fix this!

(This plea has also been posted on the MovableType support forum.)

Here’s the code in question:

First off, the JavaScript I use in my header:

function showSmileys () {
    smileybox.style.display = "block";
    moretrigger.style.display = "block";
    smileyshow.style.display = "none";
    }
function moreSmileys () {
    moresmileys.style.display = "block";
    moretrigger.style.display = "none";
    }
function hideMoreSmileys () {
    moresmileys.style.display = "none";
    moretrigger.style.display = "block";
    }
function hideSmileys () {
    smileybox.style.display = "none";
    moresmileys.style.display = "none";
    smileyshow.style.display = "block";
    }

Next, the code I use on the links:

<tr id="smileyshow" style="display: block">
    <td colspan="2">
        <a href="#" onclick="showSmileys(); return false;">Show smileys &raquo;</a>
    </td>
</tr>
<tr id="smileybox" style="display: none">
    <td colspan="2">
        Just click to add the code for the smiley you want&hellip;the image will show up after you hit 'Post comment'!<br/>
        (Lots of image links deleted here)<br/>
        <a href="#" onclick="hideSmileys(); return false;">&laquo; Hide smileys</a> <a href="#" name="moretrigger" onclick="moreSmileys(); return false;">More smileys &raquo;</a>
    </td>
</tr>
<tr id="moresmileys" style="display: none">
    <td colspan="2">
        (Lots of image links deleted here)<br/>
        <a href="#" onclick="hideMoreSmileys(); return false;">&laquo; Hide more smileys</a>
    </td>
</tr>

Any of you kind souls have any ideas for me? Thanks!