Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Oct 2011
    Posts
    116
    Thanks
    19
    Thanked 1 Time in 1 Post

    Textboxes decoration

    Dear Sir,

    When control enter in any textbox then following codes must run.

    Please help me what is wrong with my codes

    Code:
    <html>
    <head><title>My Contacts</title>
    
    <style type="text/css">
    body{
    margin-top:100px;
    margin-left:100px;
    }
    </style>
    
    <script type="text/javascript">
    
    $(document).ready(function(){
    	$('input[type="text"]').onfocus(function(){
    	$('input[type="text"]').css({
    		"background-color:silver"
    		"font-size:12px"
    		"color:green"
    		}); 
    	 });
     });
    
    </script>
    
    
    </head>
    
    <body>
    <form>
     <input type="text" name="text1"><br />
     <input type="text" name="text2"><br />
     <input type="text" name="text3"><br />
     <input type="text" name="text4"><br />
    </form>
    
     </body>
    </html>

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    The key/value pairs in a Javascript object literal must be separated with comma. Additionally the key and the value must not be included in the same quote, they need separate quotes:
    Code:
    	$('input[type="text"]').css({
    		"background-color":"silver",
    		"font-size":"12px",
    		"color":"green"
    		});

  • #3
    Regular Coder
    Join Date
    Oct 2011
    Posts
    116
    Thanks
    19
    Thanked 1 Time in 1 Post
    Thanks but codes still not work.

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,703
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Why are you even using jQuery for this when it can be done with plain CSS (unless you are adressing Internet Explorer 6 which can be safely ignored by now, especially for minor styling issues like this)?

    Code:
    input[type=text]:focus {
    	background-color: silver;
    	font-size: 12px;
    	color: green;
    }

  • Users who have thanked VIPStephan for this post:

    tqmd1 (12-04-2013)

  • #5
    Regular Coder
    Join Date
    Oct 2011
    Posts
    116
    Thanks
    19
    Thanked 1 Time in 1 Post
    Thanks but these codes works fine in Google Chrome not in Internet Explorer 8

    Code:
    <html>
    <head><title>My Contacts</title>
    
    <style type="text/css">
    body{
    margin-top:100px;
    margin-left:100px;
    }
    
    input[type=text]:focus {
    	background-color: silver;
    	font-size: 12px;
    	color: green;
    }
    </style>
    
    </head>
    
    <body>
    <form>
     <input type="text" name="text1"><br />
     <input type="text" name="text2"><br />
     <input type="text" name="text3"><br />
     <input type="text" name="text4"><br />
    </form>
    
     </body>
    </html>
    How to make these codes workable in IE8 and above versions?

  • #6
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,703
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Quote Originally Posted by tqmd1 View Post
    How to make these codes workable in IE8 and above versions?
    By adding a doctype, I would guess.

  • Users who have thanked VIPStephan for this post:

    tqmd1 (12-04-2013)

  • #7
    Regular Coder
    Join Date
    Oct 2011
    Posts
    116
    Thanks
    19
    Thanked 1 Time in 1 Post
    Thanks problem solved


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •