Tip: you can modify some code before running
Javascript + css tab switch menu effect<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Javascript + css tab switch menu effect</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><link rel="stylesheet" type="text/css" href="http://c1.neweggimages.com.cn/WebResources/2009/Default/Css/frame091107.css" /></head><body><div id="wrap"><div id="body"><div id="main" ><div id="tabCot_product" class="tab"><div class="tabContainer"><label class="backTop">Back to top</label><ul class="tabHead" id="tabCot_product-li-currentBtn-"><li class="currentBtn">Product Description</li><li>Specification parameters</li><li>Packaging Information</li><li>Warranty terms</li> <li>Warranty terms</li></ul></div><div id="tabCot_product_1" class="tabCot"><table > <tr> <td > <p><u><b>Product Overview</b></u></p> <p></p> </td> </tr></table><div class="clear"></div></div><div id="tabCot_product_2" class="tabCot" ><div>Specification parameters:<br /></div><div class="clear"></div></div><div id="tabCot_product_3" class="tabCot" ><div></div><div class="clear"></div></div><div id="tabCot_product_4" class="tabCot" ><div>Warranty terms:<br /></div><div class="clear"></div></div><div id="tabCot_product_5" class="tabCot" ><div>Warranty terms:<br /></div><div class="clear"></div></div><div class="modBottom"> </div></div></div><div class="clear"></div></div></div><div class="noprint"><script type="text/javascript" language="jscript">Function tab (o, s, cb, ev) {// tab switch class var $ = function (o) {return document. getElementById (o)}; var css = o. split (s | '_'); if (css. length! = 4) return; this. event = ev | 'onmouseover'; o = $ (o); if (o) {this. ITEM = []; o. id = css [0]; var item = o. getElementsByTagName (css [1]); var j = 1; for (var I = 0; I<item.length;i++){if(item[i].className.indexOf(css[2])>= 0 | item [I]. className. indexOf (css [3])> = 0) {if (item [I]. className = css [2]) o ['cur'] = item [I]; item [I]. callBack = cb | function () {}; item [I] ['css '] = css; item [I] ['link'] = o; this. ITEM [j] = item [I]; item [I] ['index'] = j ++; item [I] [this. event] = this. ACTIVE ;}} return o ;}} tab. prototype = {ACTIVE: function () {var $ = function (o) {return document. getElementById (o)}; this ['link'] ['cur']. className = this ['css '] [3]; this. className = this ['css '] [2]; try {$ (this ['link'] ['id'] + '_' + this ['link'] ['cur'] ['index']). style. display = 'none'; $ (this ['link'] ['id'] + '_' + this ['index']). style. display = 'block';} catch (e) {} this. callBack. call (this); this ['link'] ['cur'] = this ;}} new tab ('tabcot _ product-li-currentBtn -','-');</script></div></body></html>
Tip: you can modify some code before running
