As before, we first create the HTML markup and CSS styling required by the example.
Open up a new copy of the template file and add the following code to the
<body>
of the page:<form> <label for="name">Enter your name: <input id="name" name="name" type="text"> <span id="help"></span> <span id="helpText">Your name. You know, the thing that people call you by</span> </label> </form>
Save this page as
fadeToggle.html
. Next we need to add a few styles. In a new page in your text editor, add the following code:form { width:280px; margin:100px auto; position:relative; } input { margin-left:5px; } #help { display:block; width:16px; height:16px; margin-top:3px; float:right; cursor:pointer; background:url(../img/help.png) no-repeat; } #helpText { display:none; width:100px; height:75px; padding:12px 18px; position:absolute; left:115px; top:-90px; font:normal...