Home/ Questions/Q 7853349
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T19:39:33+00:00

I’m a beginner web designer, and though I would try my hand at JavaScript

  • 0

I’m a beginner web designer, and though I would try my hand at JavaScript and jQuery. After looking around W3Schools for a bit, I tried to make a simple jQuery animation, but it doesn’t seem to work.

<html>
    <head>
        <script type="text/javascript" src="jQuery.js"></script>
        <script>
            $(document).ready(function(){
                $("#name").blur(funtion(){
                    if(value==null || value==""){
                        $("#name").animate({background:#D23E42}, "slow");
                    }
                });
            });
        </script>
        <style type="text/css">
        body
        {
            font-family: Arial;
        }

        #name
        {
            background:#6BAA64;
            color: #FFFFFF;
            border:2px none;
            padding:5px;
            -webkit-border-radius:8px 8px;
            -moz-border-radius:8px 8px;
            border-radius:8px 8px;
            text-align: center;
        }
        </style>
    </head>

    <body style="text-align: center;">
        Name:
        <br />
        <input id="name" type="text" value="Your Name" />
    </body>
</html>

I was just trying to setup a simple contact/registration form model, so when the name field was left empty, or wasn’t changed, would turn red (on blur).

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You got many mistakes in that code:

    $("#name").blur(function() {
    if (!this.value) {
        $(this).css('background-color', '#D23E42');
    }
});​

    Mistakes:

    • funtion => function
    • value => this.value.
    • The value of an input can never be null, it can be only an empty string.
    • animate => css, and the reason is that you can’t animate background-color changes without a plugin.
    • the color needs to be a string #D23E42 => '#D23E42'
    • background => background-color.
    • $("#name") => $(this)

    It might be a good idea to stop learning at w3school as it doesn’t seem to pay off…

    • 0