User Interface is one of the important part that comes in user Design, in order to choose the template color, here we have a small project on changing background color with JavaScript source code.
Background color Changing app is short and sweet project for the beginner, If you are practicing to learn the JavaScript from basic then you have to do small project in the beginning like Calculator, simple mathematical operations , Piano Maker, etc
JavaScript Code :
let color = document.querySelector(".color"); //selecting class name color
var body = document.querySelector("body"); // selecting body
color.addEventListener('keyup',function(event){
body.style.backgroundColor = event.target.value
});
You can just simply check the Github Link for the source code:
Steps to work in your computer
- Download the source code from the GitHub repository above.
- Create 3 different file , index.html, style.css and change.js and see the code from GitHub and paste respectively,
- And see the magic by running the code.