The sliding door realized by div css is simple and suitable for beginners (Little Pigeon Series)_Experience exchange

I have replied to several friends before about the code for the sliding door. At that time, I had not used IE7 or FF. As a result, I found that it could only be run under IE6 and the code was very long. Today, a friend asked me about this again and I had to spend the time. After a while, I finally finished this stuff, I hope you all like it;
Compatible with IE7;FF;IE6
The code is more concise and easier to read;

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Sliding door</title> <style media="screen" type="text/css"> <!-- *{font-size:12px;} html,body{margin:0;text-align:center;over-flow:hidden;height:100%;width:100%;} UL{list-style-type:none; margin:0px;} /* Standard box model */ .ttl{height:18px;} .ctt{height:auto;padding:6px;clear:both} .w936{width:936px;margin:2px 0;clear:both;border:1px solid skyblue} /* TAB switching effect */ .tb_{background-color: #E6F2FF; background-image: url('http://www.dc18.com/images/barbg_tab.gif'); background-repeat: repeat-x;} .tb_ ul{height:24px;} .tb_ li{float:left;height: 24px;padding-top: 6px;width: 94px;cursor:pointer;} .normaltab { background-image:url('http://www.dc18.com/images/normal_tab.gif'); background-repeat: no-repeat; color:#1F3A87 ;} .hovertab { background-image: url('http://www.dc18.com/images/hover_tab.gif'); background-repeat: no-repeat; color:#1F3A87; font-weight:bold } .dis{display:block;} .undis{display:none;} --> </style> <script type="text/javascript" language="javascript"> <!-- function g(o){return document.getElementById(o);} function HoverLi(n){ //婵</script>