CODEWITHSUNDEEP
javascripthtmltoggle
muffinjello
muffinjello

Reputation: 158

Can't toggle element display for 'tab' like effect

I am currently creating a comment system on my website, and I'm trying to toggle the display on an element when a user clicks on the button to display the comment box, however the button doesn't appear to toggle/do anything.

Can anyone please help me? The code I'm using can be found here.

It's quite long so I've used pastebin to link it.

What's happening is I'm trying to hide my own box that contains the commenting system (disqus), but that appears to do nothing! :(

Any help is greatly appreciated.

Upvotes: 0

Views: 114

Answers (1)

Jacob T. Nielsen
Jacob T. Nielsen

Reputation: 2978

You are missing the end bracket when declaring the "toggle" function. See the code comment below.

<script>
function toggle() {
    var ele = document.getElementById("cbox");
    var text = document.getElementById("displaytext");
    if(ele.style.display == "block") {
            ele.style.display = "none";
            text.innerHTML = "View Comments";
    }
    else {
            ele.style.display = "block";
            text.innerHTML = "Hide Comments";
    }
} // <-- This one is missing!
</script>

furthermore the initial display state of "cbox" should be changed from "hide" to "none" like this

<div style="display: none;" id="cbox" class="comments">

If have tested your code with these 2 changes and it works!

Upvotes: 2

Related Questions