没有公告
仿windows选项卡或叫做tabpan以及tabpage,现在还有最新的进展譬如仿淘宝网导航菜单效果皆属于此类:
运行代码框<script type="text/javascript" > function TabPage(width, height, tabTitleArray, tabPageArray) { var ids = new Array(); var id = document.uniqueID; var tabTitleHtml = ""; var index = 0; for (var i = 0; i < tabTitleArray.length; i++) { tabTitleHtml += "<table border='0' cellspacing='0' cellpadding='0' width='" + width + "'>" + "<tbody><tr>"; var titles = tabTitleArray[i]; for (var n = 0; n < titles.length; n++) { var myId = id + index; ids[index] = myId; var title = titles[n]; tabTitleHtml += "<td class='TabTitle'" + " onclick=\"secBoard(this, '" + myId + "')\">" + title + "</td>"; index++; } tabTitleHtml += "</tr></tbody></table>"; } var tabPageHtml = ""; for (var i = 0; i < tabPageArray.length; i++) { tabPageHtml += "<tbody id='" + ids[i] + "' style='display:none''>" + "<tr><td>" + tabPageArray[i] + "</td>" + "</tr></tbody>"; } var controlID = document.uniqueID.toString(); var html = "<table id='" + controlID + "' width='" + width + "' border='0'><tbody><tr><td>" + tabTitleHtml + "<table border='0' cellspacing='0' cellpadding='0' width='" + width + " ' height='" + height +"' class='TabPage'>" + tabPageHtml + "</table>" + "</td></tr></tbody></table>"; // window.clipboardData.setData('text', html); document.write(html); document.getElementById(controlID).rows[0].cells[0].children[0].rows[0].cells[0].click(); } function secBoard(obj, tabPageID) { // td. tr. tbody table var currentTabTitleTable = obj.parentNode.parentNode.parentNode; var container = obj.parentNode.parentNode.parentNode.parentNode; for (var n = 0; n < container.children.length - 1; n++) // 最后一个Childe是TabPageTable { var cells = container.children[n].rows[0].cells; for(var i = 0; i < cells.length; i++) { var cell = cells[i] if (cell.className == "SelectedTabTitle") { cell.className = "TabTitle"; break; } } } obj.className = "SelectedTabTitle"; var tabPageTable = container.lastChild; for (var i = 0; i < container.children.length; i++) { var node = container.
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10] ... 下一页 >>