Advanced Search

Return to Snippet

Revision: 18021
at September 21, 2009 14:27 by KF
Initial Code 
<script type="text/javascript">
$(document).ready(function(){
		$('input').focus(function() {
			$(this)
				.parent().addClass('highlight')
		});

		$('input').blur(function(){
			$(this)
				.parent().removeClass('highlight')
		});

	});
</script>
<style type="text/css">
.input {
	padding:6px;
	width:315px;
	border: 1px solid #fff;
}
input {
	border:4px solid #666;
	padding:4px;
	width:300px;
}
.highlight {
	background-color:#FF6;
	border: 1px solid #FC6;
}


</style>

<div class='input'> Name:<br/>
  <input name='Name' type='text'/>
</div>
<div class='input'> Email:<br/>
  <input name='Email' type='text'/>
</div>
<div class='input'> Town:<br/>
  <input name='Email' type='text'/>
</div>
Initial URL 
http://papermashup.com/jquery-form-highlighting/
Initial Description 

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
jQuery Form Highliting

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
jQuery