CSS page Making tutorial: When the mouse points to the Div area to enlarge

Article Introduction: The mouse points to the Div area to enlarge.

Css

#box {width: 200px; height: 200px; position: absolute; top: 50%; left: 50%; margin-left: -100px; margin-top: -100px; background-color: green; -moz-border- radius: 6px; -webkit-border-radius: 6px;}
window.onload = function () {// Execute functionzoom (id, x, y) after loading the DOM {// Set the zoom function parameters, id, horizontal zoom factor, vertical zoom factor // Get the element object value vardW = obj.clientWidth; // Get the element width vardH = obj.clientHeight; // Get the element height obj.onmouseover = function () * x + "px"; // Horizontal scaling this.style.height = dH * y + "px"; // Vertical scaling this.style.backgroundColor = "# f00"; // Background color transformation this.style.zIndex = 1 ; // Z-axis priority} obj.onmouseout = function () {// Mouse leaves the element and set the default value this.style.width = ""; this.style.height = ""; this.style.backgroundColor = "" ; this.style.zIndex = "";}} zoom ("box", 1.5,1.5); // Call function}

1	</span><div id="box"></div>