How To Show And Hide Input Fields Based On Radio Button Selection

Question

Here is the code to show input fields depending on radio selection like:

SCRIPT

Answer 1

Use display:none/block, instead of visibility, and add a margin-top/bottom for the space you want to see ONLY when the inputs are shown

 function yesnoCheck() {
        if (document.getElementById('yesCheck').checked) {
           document.getElementById('ifYes').style.display = 'block';
        } else {
           document.getElementById('ifYes').style.display = 'none';
        }
    }

and your HTML line for the ifYes tag

<div id="ifYes" style="display:none;margin-top:3%;">If yes, explain:

Answer 2

Use display:none to not show the items, then with JQuery you can use fadeIn() and fadeOut() to hide/unhide the elements.

http://www.w3schools.com/jquery/jquery_fade.asp