JavaScript Background Color Change

Click to get information about our services.

Colors are very important in the web development process, both at the design and coding stages. Correct use of the colors determined by the designers during the coding stage increases the quality of the website. At this point, the document.body.style.BackgroundColor property comes into play.

The document.body.style.BackgroundColor property is a command used in the JavaScript language and is used to determine the background color of the web page. Through this feature, the background color of the web page can be easily changed to different colors.

Sample Code:


<div>
    <button onclick="arkaplankirmizi()">Beyaz Yap</button>
</div>
<script>
    function arkaplankirmizi() {
        document.body.style.backgroundColor = "red";
    }
</script>

In the example above, a button was created in a div, the "onclick" property was given to the button, and the JavaScript code that should be run when clicked was added. If you want it to change when you touch a picture with the mouse or a text when you touch it with the mouse, you should use "onmouseover".

Thanks to this feature, the background color of web pages can be changed to match the colors of your brand or the purpose of the site. For example, you can choose pastel colors for a fashion blog, or use darker colors for a technology-focused site.