Finetuning Show/Hide Links

programming web dev
1

I’m being asked to create the following effect: When you rollover a text link you will see two category links appear beside it. Then when you roll off the two category links will disappear. To make the two links persistent you would have to click on the first text link and then the category links would appear and be clickable. The logic is a little screwy when it comes to the onmouseover/onmouseout part. I think there needs to be a variable set when the user clicks that will turn off the onmouseover/onmouseout effect. Does anyone know how to improve this code? Test file is attached. The javascript looks like this:


<script language="JavaScript" type="text/javascript">
<!--
    function toggle_visibility(id) {
       var elm = document.getElementById(id);
       if(elm.style.display == 'inline')
          elm.style.display = 'none';
       else
          elm.style.display = 'inline';
    }
    function show_element(id) {
       var elm = document.getElementById(id);
          elm.style.display = 'inline';
    }
//-->
</script>