We are browsing some websites, especially some novel websites, there will be a change in the background color of the page, this feature using jquery is easy to implement.
Effect Chart:
Show your code:
Copy Code code as follows:
<!doctype html>
<meta charset= "Utf-8" >
<title>jquery test</title>
<script src= "Jquery-1.11.1.min.js" ></script>
<body>
<button style= "Background-color:white" value= "white" >white</button>
<button style= "background-color:red" value= "Red" >red</button>
<button style= "Background-color:green" value= "green" >green</button>
<button style= "Background-color:yellow" value= "Yellow" >yellow</button>
<div class= "Show" >
</div>
<script>
$ ("button"). Click (
function ()
{
var color = This.value;
$ ("Body"). CSS ("Background-color", color);
}
)
</script>
We first select the object we want to manipulate based on the element name: button, then use the click Method to find the button that is clicked, then get the corresponding color value of the button in the triggered event, and then pass the color value as the Background-color property value through the CSS () method.
