I had made a input box with jQuery
The following code works just fine, only problem with it is that, when i enter text into it the size of input box get increased. And I dont want that width to be increased any modification or solution over this please !
Thank you !
<!DOCTYPE HTML>
<html>
<head>
<title>New Style</title>
<style type="text/css">
input{
position: fixed;
left : 30%;
top : 40%;
width:300px;
height: 30px;
border-style:double;
padding-left:50px;
}
label {
position:fixed;
left:30%;
top:40%;
background-color:LIGHTGRAY;
width:50px;
z-index:1;
}
</style>
<script type="text/javascript" src="jquery.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
$('input').focus(function(){
$('label').slideUp('slow');
$('input').animate({paddingLeft:"0px"},'slow');
});
$('input').blur(function(){
$('label').slideDown('slow');
$('input').animate({paddingLeft:"50px"},'slow');
});
});
</script>
</head>
<body>
<label for="name">Name</label>
<input type="text" autocomplete ="off">
</body>
</html>

New Topic/Question
Reply



MultiQuote



|