Simple Java Script Snippets

Just collecting a few useful bits of Javascript I have seen.

Simple Mouse over to reveal

<table>
<TD align="right" onMouseOver="this.style.color='#000000'" onMouseOut="this.style.color='#FFFFFF'">Text to reveal</TD>
</table>

Wave your mouse over the middle box to make the text appear and disappear....

hidden text >>

Text to reveal

<< hidden text

Enable and Disable Buttons

For Accept and Decline of Ts&Cs for example.

Copied from Google Base Ts and Cs form.

JavaScript for the Header

<script type="text/javascript">
        function selectAccept() {
          document.getElementById('doAccept').disabled=false;
          document.getElementById('doReject').disabled=true;
        }
          function selectReject() {
            document.getElementById('doAccept').disabled=true;
            document.getElementById('doReject').disabled=false;
          }
      </script>

HTML Code for the body of the form

Also I need to get better at using Labels I think especially in %SEARCH% results.

<form......>
<label for="tosChoiceA"><input name="tosChoice" id="tosChoiceA" type="radio" onclick="selectAccept()">
<b>Yes, I have read and accept the above Terms of Service</b></label>
<input name="doAccept" id="doAccept" type="submit" style="font-weight:bold;" value="Continue »">
<input name="tosChoice" id="tosChoiceB" type="radio" onclick="selectReject()">
<b>No, I do not accept the above Terms of Service</b></label>

<input name="doReject" id="doReject" type="submit" style="font-weight:bold;" value="Pause this account">
......
</form>

....a little bit of code to make sure things are set on the intial load of the page......

<script type="text/javascript">
        document.getElementById('doAccept').disabled=true;
        document.getElementById('doReject').disabled=true;
</script>

-- NeilGood - 26 May 2009

---

This topic: Sandbox > WikiUsers > NeilGood > NeilGoodSandbox > SimpleJavaScriptSnippets
Topic revision: 27 May 2009, NeilGood

---