Div+css Style simple Layout tab Toggle

"http://www.w3.org/1999/xhtml">"Server"> <title></title> <script src=".. /js/jquery/jquery-1.9.1.js"Type="Text/javascript"></script> <style type="Text/css">. content {margin:50px;            border:8px;            Width:auto;        Height:auto;            }. title {height:20px;        Width:auto; }. Common {width: -%; float: Left; Font-size:20px;            Color:black; Background-color: #E0E0E0; }. Selected {background-color: #EEE;            }. contentbody {width:auto;        height:500px;            }. contendiv {padding:20px; Width: the%;            height:500px; float: Left; Background-color: #EEE;        }. divhidden {display:none; }    </style> <script type="Text/javascript">$ (function () {$ (". Common"). Click (function () {vardivID = $ ( This). attr ("ID"); //alert (divid);                if(JQuery ( This). attr ("class"). IndexOf ("selected") >0) {                    //JQuery (this). Removeclass ("selected")}Else {                    $("Div"). Removeclass ("selected"); JQuery ( This). AddClass ("selected"); }                                //var list = $ (". Contendiv");                $(". Contendiv"). AddClass ("Divhidden"); $("#div"+ divid). Removeclass ("Divhidden");        });    }); </script>"Form1"runat="Server"> <div> <divclass="content"> <divclass="title"> <div id="1" class="Common selected">TAB1</div> <div id="2" class="Common">TAB2</div> <div id="3" class="Common">Tab3</div> </div> <divclass="Contentbody"> <div id="Div1" class="Contendiv">I'm tab1 .</div> <div id="Div2" class="Contendiv Divhidden">I'm tab2 .</div> <div id="Div3" class="Contendiv Divhidden">I'm tab3 .</div> </div> </div> </div> </form></body>

This is one of the simplest and most primitive basic tab transitions to look like. Very simple, just learn the style layout jquery students can refer to. Daniel, don't shoot bricks.
As long as the control of the head of the div Click event is OK, the corresponding three div below should toggle the hidden. So easy!