JavaScript toggle

I made a JavaScript function to hide a link on click of button and its work here the function

    <s开发者_开发知识库cript type="text/javascript">
function toggle() 
{
    var ele = document.getElementById("yui-gen1");
    var text = document.getElementById("windows");
    if(ele.style.display == "block") {
            ele.style.display = "none";
    }
    else {
        ele.style.display = "block";
    }
} 
</script>

But when it hidea the next link replace its place. I want nothing to replace its place, I want its place after the hiding to be just empty. Is there any way to do that?

Assuming I've understood your question correctly, your problem is that display:none causes the affected element to take up no space in the document. What you need is the visibility property, which hides the affected element but keeps it's space in the document:

ele.style.visibility = "hidden";

and

ele.style.visibility = "visible";

should work, instead of display.

Try setting visibility instead. Visibility will still take up the space that the button occupied, it just won't show it. Display removes it altogether so the space will be taken up by the next element.