Описание
Две колонки по бокам(1-200) и пять слайдеров в середине.
HTML-верх
Код:<style> #minor {margin-left: -10px; background: url() no-repeat top center;} #menu {margin-left: 5px;} #menu div { margin: 0 3px; width: 81px; text-decoration: none; float: left; height: 30px; line-height: 27px; } #menu .tabactive { color: #E99A57; } #submenu { height: 210px; text-align: center; width: 440px; } .submenutext { display: none; height: 100%; padding: 1px; } </style>
HTML-низ
Код:<script type="text/javascript"> $(document).ready(function() { $("td.#MenuTxT div.submenutext").hide(); <!--$(".tabs div:first").addClass("active").show(); --> $("td.#MenuTxT div.submenutext:first").show(); $("div.#menu div").click(function() { $("div.#menu div").removeClass("tabactive"); $(this).addClass("tabactive"); $("td.#MenuTxT div.submenutext").hide(); var activeDiv = $(this).attr("alt"); $("div."+activeDiv).fadeIn(); return false; }); }); </script>
Объявления
Код:<table cellspacing="1" cellpadding="1" border="0" style="width: 840px; height: 250px;" id="minor"> <tr> <td align="center" valign="top" style="width: 200px;"> Ширина колонки 1 - 200 px </td> <td align="center" valign="top" style="width: 440px;"> <!--- Вкладки ---> <table cellspacing="0" cellpadding="0" style="width: 100%;"> <tbody> <tr> <td align="center"> <div id="menu"> <div alt="#sm1" "style="cursor: pointer;">Кнопка 1</div> <div alt="#sm2" "style="cursor: pointer;">Кнопка 2</div> <div alt="#sm3" "style="cursor: pointer;">Кнопка 3</div> <div alt="#sm4" "style="cursor: pointer;">Кнопка 4</div> <div alt="#sm5" "style="cursor: pointer;">Кнопка 5</div> </div> </td> </tr> <tr> <td id="MenuTxT" align="center" valign="top"> <div id="submenu" align="center"> <div id="sm1" class="submenutext" style="display:block;"> Содержимое 1-й кнопки </div> <div id="sm2" class="submenutext"><br /><br /> Содержимое 2-й кнопки </div> <div id="sm3" class="submenutext"><br /><br /> Содержимое 3-й кнопки </div> <div id="sm4" class="submenutext"><br /><br /> Содержимое 4-й кнопки </div> <div id="sm5" class="submenutext"><br /><br /> Содержимое 5-й кнопки </div> </div> </td> </tr> </tbody> </table> <!--- END Вкладки ---> </td> <td align="center" valign="top" style="width: 200px;"> Ширина колонки 2 - 200 px </td> </tr> </table>