want to fade in and fadeout the background color in webpage?

Question

Javascript Jquery code

want to fade in and fade out the background color on div

    $("div").focusin(function(){
        $(this).css("background-color","green"),fadein(5000);
    });
    $("div").focusout(function(){
        $(this).css("background-color","white"),fadein(5000);
    });

})

HTMl code

<div>
  first name:
  <input type="text" name="" id="" />
  last name:
  <input type="text" name="" id="" />
</div>

Does this answer your question? [jQuery animate backgroundColor](https://stackoverflow.com/questions/190560/jquery-animate-backgroundcolor) — Martin, Apr 24 '21 at 19:15

vanowm · Accepted Answer · 2021-04-25T14:32:20.067

1

Unless you specifically want to do it with jquery, there is an easy css-only method:

input
{
  transition: background-color 5s ease;
  background-color: white;
}
input:focus
{
  background-color: green;
}

<div>
  first name:
  <input type="text" name="" id="">
  last name:
  <input type="text" name="" id="">
</div>

edited Apr 25 '21 at 14:32

answered Apr 24 '21 at 18:51

vanowm

9,466
2
21
37

want to fade in and fadeout the background color in webpage?

1 Answers1