A question about Alibaba's interview, a question about Alibaba's interview
I found this interview question from Alibaba. It was very interesting and I did it.
Use div + css to make the following results:
When you move the cursor over a div with a red color, the size of the div increases by 25%, and the other values remain unchanged. For example:
The Code is as follows:
<! Doctype html>
<Html lang = "en">
<Head>
<Meta charset = "UTF-8">
<Script type = "text/javascript" src = "js/jquery-1.12.2.js"> </script>
<Script type = "text/javascript">
$ (Function (){
$ ("Div: first"). hover (
Function (){
((This).css ({width: "125px", height: "125px "});
}, Function (){
((This).css ({width: "100px", height: "100px "});
});
});
</Script>
<Style type = "text/css">
Body {
Margin: 0px;
Padding: 0px;
}
# Red {
Box-sizing: border-box;
Background-color: red;
Width: 100px;
Height: 100px;
Position: relative;
Z-index: 11;
}
# Green {
Box-sizing: border-box;
Background-color: green;
Width: 100px;
Height: 100px;
Position: absolute;
Top: 100px;
Z-index: 10;
}
# Gray {
Box-sizing: border-box;
Background-color: gray;
Width: 100px;
Height: 200px;
Position: absolute;
Left: 100px;
Top: 0px;
Z-index: 10;
}
</Style>
</Head>
<Body>
<Div id = "red"> </div>
<Div id = "green"> </div>
<Div id = "gray"> </div>
</Body>
</Html>
