JavaScript Background Color Change

Blog Gönderisi Resmi

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.

CODES

See the Pen Untitled by EnesAlp (@enesalpcomtr) on CodePen.

What We Recommend For You

Blog Resim
What is JavaScript Object Oriented Programming?

JavaScript

JavaScript is a widely used language for web development today. Applying object-oriented programming (OOP) principles while using this language ..

Read More
Blog Resim
What is Next.js? What are the Advantages and Features?

JavaScript

Next.js, one of the most preferred tools by developers when creating web applications and sites, is a framework that works on the basis of React ..

Read More
Blog Resim
JavaScript Background Color Change

JavaScript

Colors are very important in both the design and coding stages in the web development process. The correct use of the colors determined by the ..

Read More
Blog Resim
Most Used in JavaScript Libraries

JavaScript

JavaScript is one of the most used programming languages by web developers and is often used to add interactive features to web pages. The ..

Read More