CODEWITHSUNDEEP
javascriptjqueryhtml
Spirit_Scarlet
Spirit_Scarlet

Reputation: 327

JQuery animate an input field

I searched and I couldn't find anything like my problem, so I am sorry if this is already asked. I have an input field and a button. If the text entered matched "IA" the borders of the input field should turn red, green, blue and white. Mine are only going to red and stopping. Here is the code. I will appreciate any help. HTML: 

       <body>
                <input id="enter" type="text"> 
                <button id="validate">Validate</button>
          </body>

JQuery:

            $(document).ready(function() {

            $("#validate").click(function(){
                var a = "ia";
                if($("#enter").val()==a){
                    $("#enter").animate({
                        border: "3px solid red"
                    },1000, function(){
                        border: "3px solid green"
                    },1000, function(){
                        border: "3px solid blue"
                    },1000, function(){
                        border: "3px solid white"
                    },1000);
                }

            });
            });

Upvotes: 0

Views: 3352

Answers (1)

hsz
hsz

Reputation: 152266

You should try with:

$("#enter").animate({
    border: "3px solid red"
},1000).animate({
    border: "3px solid green"
},1000).animate({
    border: "3px solid blue"
},1000).animate({
    border: "3px solid white"
},1000);

Upvotes: 3

Related Questions