JS+DIV to achieve the mouse across the switch layer effect of the instance code

< Style>

. None {display: none; }
The block {display: block; }

. S_c {width: 800 px; The text - align: center; }
. S_c ul {clear: both; Margin: 0; }
. S_c li {list - style: none; Float: left; Position: relative; Width: 70 px; }
/ * * /
. C_0 {background - color: # CCCCCC; }
The c_1 {background - color: # 0000 cc; }
/ * * /
The s_b {
Border: 1 px solid # 666;
Height: 160 px;
Width: 440 px;
}

/ * * /

< / style>
< Script language = "javascript" >
The function of aa (s_id) {
For (I = 1; I< 7. I++) {
    If (I = = s_id) {
      Document. The getElementById (" s "+ I). The className =" block "; // style of content
      Document. The getElementById (" m "+ I). The className =" c_ + I + "c_1";" // head style
      / / the document. The getElementById (" uid_ "+ I). The focus ();
    }
    The else
    {
      Document. The getElementById (" s "+ I). The className =" none "; // the content is not displayed
      Document. The getElementById (" m "+ I). The className =" c_0 "; //
    }
}
}
< / script>

< Div >
< Ul>
< Li> < Div id = "m1" > < A href = "#" onmouseover = "aa (1)" > A classification < / a> < / div> < / li>
< Li> < Div id = "m2" > < A href = "#" onmouseover = "aa (2)" > Category 2 < / a> < / div> < / li>
< Li> < Div id = "m3" > < A href = "#" onmouseover = "aa (3)" > Classification of three < / a> < / div> < / li>
< Li> < Div id = "m4 >" < A href = "#" onmouseover = "aa (4)" > Classification of four < / a> < / div> < / li>
< Li> < Div id = "m5" > < A href = "#" onmouseover = "aa (5)" > Classification of five < / a> < / div> < / li>
< Li> < Div id = "m6" > < A href = "#" onmouseover = "aa (6)" > Classification of six < / a> < / div> < / li>
< / ul>
< / div>

< Div >

< Div id = "s1" >
< Div> Part I < / div>
< / div>
< Div id = "s2" >
< Div > Part two < / div>
< / div>
< Div id = "s3" >
< Div > Part iii < / div>
< / div>
< Div id = "s4" >
< Div > Part iv < / div>
< / div>
< Div id = "s5 >"
< Div > Part v < / div>
< / div>
< Div id = "s6" >
< Div > Part 6 < / div>
< / div>

< / div>