注册 | 登陆

您的位置：阿里西西 > 网页特效 > 页面特效 > 详细内容

0顶

仿windows选项卡特效集

稿源：互联网 2022-04-27 08:36:42 点击： 1532 撤稿纠错

仿windows选项卡特效集，阿里西西网页特效收集。

以下讨论的是和特效选项卡相关的仿windows选项卡特效集教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<script type="text/javascript" ><br>function TabPage(width, height, tabTitleArray, tabPageArray)<br>{<br>    var ids = new Array();<br>    var id = document.uniqueID;<br>    var tabTitleHtml = "";<br>    var index = 0;<br>    for (var i = 0; i < tabTitleArray.length; i++)<br>    {<br>        tabTitleHtml += "<table border='0' cellspacing='0' cellpadding='0' width='" + width + "'>" <br>                     +      "<tbody><tr>";<br>        var titles = tabTitleArray[i];<br>        for (var n = 0; n < titles.length; n++)<br>        {<br>            var myId = id + index;<br>            ids[index] = myId;<br>            var title = titles[n];<br>            tabTitleHtml += "<td class='TabTitle'"<br>                         +  " onclick="secBoard(this, '" + myId + "')">" + title + "</td>";<br>            index++;<br>        }<br>        tabTitleHtml += "</tr></tbody></table>";    <br>    }<br>                 <br>    var tabPageHtml = "";<br>    for (var i = 0; i < tabPageArray.length; i++)<br>    {<br>        tabPageHtml += "<tbody id='" + ids[i] + "' style='display:none''>" <br>                    +  "<tr><td>" + tabPageArray[i] + "</td>" + "</tr></tbody>";<br>    }<br>    var controlID = document.uniqueID.toString();<br>    var html = "<table id='" + controlID + "' width='" + width + "' border='0'><tbody><tr><td>"<br>             +      tabTitleHtml <br>             +      "<table border='0' cellspacing='0' cellpadding='0' width='" + width <br>             +          " ' height='" + height +"' class='TabPage'>"<br>             +              tabPageHtml <br>             +      "</table>"<br>             + "</td></tr></tbody></table>";<br>//             window.clipboardData.setData('text', html);<br>    document.write(html);<br>    document.getElementById(controlID).rows[0].cells[0].children[0].rows[0].cells[0].click();<br>}<br>function secBoard(obj, tabPageID)<br>{<br>    //              td.            tr.        tbody      table      <br>    var currentTabTitleTable = obj.parentNode.parentNode.parentNode;<br>    var container = obj.parentNode.parentNode.parentNode.parentNode;<br>    <br>    for (var n = 0; n < container.children.length - 1; n++) // 最后一个Childe是TabPageTable<br>    {<br>        var cells = container.children[n].rows[0].cells;<br>        for(var i = 0; i < cells.length; i++)<br>        {<br>            var cell = cells[i]<br>            if (cell.className == "SelectedTabTitle")<br>            {<br>                cell.className = "TabTitle";<br>                break;<br>            }<br>        }<br>    }<br>    obj.className = "SelectedTabTitle";<br>    <br>    <br>    var tabPageTable = container.lastChild;<br>     <br>    for (var i = 0; i < container.children.length; i++)<br>    {<br>        var node = container.children[i];<br>        if (node != currentTabTitleTable) continue;<br>        <br>        if (node.nextSibling == tabPageTable) break;<br>            <br>        node.swapNode(node.nextSibling);<br>        node = container.children[i+1];<br>    }<br>    <br>    for(var i = 0; i < tabPageTable.tBodies.length; i++)<br>    {<br>        var tbody = tabPageTable.tBodies[i];<br>        <br>        if (tbody.style.display != "none")<br>        {<br>            tbody.style.display = "none";<br>            break;<br>        }<br>    }<br>    document.getElementById(tabPageID).style.display = "block";<br>}<br>function GetPinYinArray()<br>{<br>    var pinYinArray = new Array(<br>        new Array('a','ai','an','ang','ao'),<br>        new Array('ba','bai','ban','bang','bao','bei','ben','beng','bi','bian','biao','bie','bin','bing','bo','bu'),<br>        new Array('ca','cai','can','cang','cao','ce','cen','ceng','cha','chai','chan','chang','chao','che','chen','cheng','chi','chong','chou','chu','chua','chuai','chuan','chuang','chui','chun','chuo','ci','cong','cou','cu','cuan','cui','cun','cuo'),<br>        new Array('da','dai','dan','dang','dao','de','deng','di','dia','dian','diao','die','ding','diu','dong','dou','du','duan','dui','dun','duo'),<br>        new Array('e','en','er'),<br>        new Array('fa','fan','fang','fei','fen','feng','fo','fou','fu'),<br>        new Array('ga','gai','gan','gang','gao','ge','gei','gen','geng','gong','gou','gu','gua','guai','guan','guang','gui','gun','guo'),<br>        new Array('ha','hai','han','hang','hao','he','hei','hen','heng','hong','hou','hu','hua','huai','huan','huang','hui','hun','huo'),<br>        new Array(),<br>        new Array('ji','jia','jian','jiang','jiao','jie','jin','jing','jiong','jiu','ju','juan','jue','jun','jv'),<br>        new Array('ka','kai','kan','kang','kao','ke','ken','keng','kong','kou','ku','kua','kuai','kuan','kuang','kui','kun','kuo'),<br>        new Array('la','lai','lan','lang','lao','le','lei','leng','li','lia','lian','liang','liao','lie','lin','ling','liu','long','lou','lu','luan','lue','lun','luo','lv'),<br>        new Array('ma','mai','man','mang','mao','me','mei','men','meng','mi','mian','miao','mie','min','ming','miu','mo','mou','mu'),<br>        new Array('na','nai','nan','nang','nao','ne','nei','nen','neng','ni','nian','niang','niao','nie','nin','ning','niu','nong','nou','nu','nuan','nue','nuo','nv'),<br>        new Array('o','ou'),<br>        new Array('pa','pai','pan','pang','pao','pei','pen','peng','pi','pian','piao','pie','pin','ping','po','pou','pu'),<br>        new Array('qi','qia','qian','qiang','qiao','qie','qin','qing','qiong','qiu','qu','quan','que','qun'),<br>        new Array('ran','rang','rao','re','ren','reng','ri','rong','rou','ru','ruan','rui','run','ruo'),<br>        new Array('sa','sai','san','sang','sao','se','sen','seng','sha','shai','shan','shang','shao','she','shen','sheng','shi','shou','shu','shua','shuai','shuan','shuang','shui','shun','shuo','si','song','sou','su','suan','sui','sun','suo'),<br>        new Array('ta','tai','tan','tang','tao','te','teng','ti','tian','tiao','tie','ting','tong','tou','tu','tuan','tui','tun','tuo'),<br>        new Array(),<br>        new Array(),<br>        new Array('wa','wai','wan','wang','wei','wen','weng','wo','wu'),<br>        new Array('xi','xia','xian','xiang','xiao','xie','xin','xing','xiong','xiu','xu','xuan','xue','xun'),<br>        new Array('ya','yan','yang','yao','ye','yi','yin','ying','yo','yong','you','yu','yuan','yue','yun'),<br>        new Array('za','zai','zan','zang','zao','ze','zei','zen','zeng','zha','zhai','zhan','zhang','zhao','zhe','zhen','zheng','zhi','zhong','zhou','zhu','zhua','zhuai','zhuan','zhuang','zhui','zhun','zhuo','zi','zong','zou','zu','zuan','zui','zun','zuo')<br>        );<br>       <br>    var array = new Array(pinYinArray.length);<br>    for (var i = 0; i < pinYinArray.length; i++)<br>    {<br>        var html  = "";<br>        var myArray = pinYinArray[i];<br>        for (var n = 0; n < myArray.length; n++)<br>        {<br>            html += myArray[n] + " ";<br>        }<br>        html += "";<br>        <br>        array[i] = html;<br>    }<br>    <br>    return array;<br>} <br>function GetFirstLetterArray()<br>{<br>    var array = new Array(<br>        new Array('A','B','C','D','E','F','G'),<br>        new Array('H','I','J','K','L','M','N'),<br>        new Array('O','P','Q','R','S','T'),<br>        new Array('U','V','W','X','Y','Z'));<br>    return array;<br>}<br>// 调用例子一<br>new TabPage(200, 50,GetFirstLetterArray(), GetPinYinArray()  );<br>// 调用例子二<br>var titleArray = new Array(<br>    new Array(1, 2, 3, 4),<br>    new Array(5, 6, 7, 8),<br>    new Array(9, 10, 11, 12),<br>    new Array(13, 14, 15, 16));<br>var pageArray =  <br>    new Array(1, 2,3 ,4, 5,6,7,8,9,10,11,12,13,14,15,16);<br>new TabPage(200, 50,titleArray, pageArray  );<br></script><br> <style type="text/css"><br> <br>.TabTitle { <br>    text-align: center;<br>    background-color:#99CC99;<br>    cursor: hand;<br>    color: #000000;<br>    border-left: 1px solid #F0F0F0;<br>    border-top: 1px solid #F0F0F0;<br>    border-right: 1px solid gray;<br>    border-bottom: 1px solid #F0F0F0<br>    }<br>.SelectedTabTitle { <br>    text-align: center;<br>    background-color:  #D2D8D8;<br>    cursor: hand;<br>    color: blue;<br>    border-left: 1px solid #F0F0F0; <br>    border-top: 1px solid #F0F0F0; <br>    border-right: 1px solid gray; <br>    }<br>.TabPage {<br>    background-color:  #D2D8D8;<br>    color: #000000;<br>    border-left:1px solid #F0F0F0;<br>    border-right: 1px solid gray;<br>    border-bottom: 1px solid gray; <br>    }<br></style></font><br><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于仿windows选项卡特效集的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200904041211.shtml方便下次再访问哦。

·上一篇： DIV在3秒后自动向右上角缩小并且消失
·下一篇： 仿windows选项卡特效2

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »