diff options
| -rw-r--r-- | templates/web/southampton/header.html | 4 | ||||
| -rw-r--r-- | web/js/southampton.js | 15 |
2 files changed, 17 insertions, 2 deletions
diff --git a/templates/web/southampton/header.html b/templates/web/southampton/header.html index 7cd696618..5d94d5bdf 100644 --- a/templates/web/southampton/header.html +++ b/templates/web/southampton/header.html @@ -28,7 +28,7 @@ <form id="frmSearch" method="get" action="http://websearch.southampton.gov.uk/search"> <fieldset> <label for="searchbox">Search the site<br /></label> - <input class="text" type="text" value="Enter keywords" id="searchbox" name="q"/> + <input class="text" type="text" value="" placeholder="Enter keywords" id="searchbox" name="q"/> <input type="hidden" id="site" name="site" value="SouthamptonOnline"/> <input type="hidden" id="client" name="client" value="SouthamptonOnline"/> <input type="hidden" id="proxystylesheet" name="proxystylesheet" value="SouthamptonOnline"/> @@ -41,7 +41,7 @@ <label for="PostCode">Where I live <img class="moreInfo" src="/cobrands/southampton/information.gif" alt="Find information about where you live" title="Find information about where you live" /><br /> </label> - <input id="PostCode" name="Postcode" class="text2" type="text" value="Enter street/postcode" /> + <input id="PostCode" name="Postcode" class="text2" type="text" value="" placeholder="Enter street/postcode" /> <input class="button" type="submit" value="go" /> </fieldset> </form> diff --git a/web/js/southampton.js b/web/js/southampton.js index da9552f05..1f3e16105 100644 --- a/web/js/southampton.js +++ b/web/js/southampton.js @@ -6,6 +6,21 @@ $(function(){ + $('[placeholder]').focus(function(){ + var input = $(this); + if (input.val() == input.attr('placeholder')) { + input.val(''); + input.removeClass('placeholder'); + input.css({ 'color': '#000000' }); + } + }).blur(function(){ + var input = $(this); + if (input.val() == '' || input.val() == input.attr('placeholder')) { + input.css({ 'color': '#999999' }); + input.val(input.attr('placeholder')); + } + }).blur(); + $('#form_category').change(function(){ var category = $(this).val(); if ('Potholes' == category) { |