春天花會(huì)開(kāi)

          ***********

          統(tǒng)計(jì)

          留言簿(4)

          閱讀排行榜

          評(píng)論排行榜

          [原創(chuàng)]javascript封裝的Tab類-附源碼

          Web UI中常常用到Tab,每次寫(xiě)一堆HTML+css有點(diǎn)煩了,于是花了點(diǎn)時(shí)間整理了這個(gè)class,留備后用。
          為了方便我引入了prototype 1.4,省掉一串鍵盤(pán)敲擊。
          類比:www.live.com的Tab page
          用法:
          //首先載入: 'tab.js','prototype.js' and 'tab.css' in HTML page
          //? ?mytab1=new Tab('tab1',top,left,width,height);//創(chuàng)建新Tab
          //?? mytab1.addItem(name,contentid,type);//添加TabItem
          //?? mytab1.delItem(name);//刪除TabItem
          //?? 當(dāng)然一般情況下操作鼠標(biāo)即可完成添加/刪去工作.
          //???點(diǎn)擊TabItem時(shí)動(dòng)態(tài)調(diào)用 <li>標(biāo)簽rev屬性指定的方法(要不要ajax就隨你喜歡了)
          例子:

          o_LuTab.png
          <html>
          <head>
          <script src='prototype.js'></script>
          <script src='tab.js'></script>
          <link
          rel=stylesheet type="text/css" href='tab.css'/>
          </head>
          <body>
          <script><!--
          //Test case
          tab1=new Tab("tab1",100,10,600,300);
          tab2=new Tab("tab2",180,60,600,300);
          tab3=new Tab("tab3",260,110,600,300);

          tab1.addItem('hello','id','CONTENT');
          tab1.delItem('t2');
          tab1.addItem();tab1.addItem();

          tab2.addItem('hi','id','CONTENT');
          tab2.addItem();tab2.addItem();

          tab1.display();
          tab2.display();
          tab3.display();

          --></script>
          </body>
          </html>

          下載Tab.rar



          posted on 2006-10-17 09:16 春天花會(huì)開(kāi) 閱讀(2190) 評(píng)論(3)  編輯  收藏

          評(píng)論

          # re: [原創(chuàng)]javascript封裝的Tab類-附源碼 2008-07-22 16:49 cxp

          我想問(wèn)問(wèn),你這個(gè)動(dòng)態(tài)添加頁(yè)簽的能不能做成象126郵箱里面的效果,我點(diǎn)擊左邊樹(shù)的連接的時(shí)候生成一個(gè)頁(yè)簽頁(yè)面,再點(diǎn)擊再出來(lái),我看了你這個(gè)生成的頁(yè)面的信息是在new這個(gè)tab對(duì)象的時(shí)候就傳進(jìn)去的啊。  回復(fù)  更多評(píng)論   

          # re: [原創(chuàng)]javascript封裝的Tab類-附源碼 2008-07-28 20:13 luchunwei

          應(yīng)該可以的,你改改試試,把click事件的監(jiān)聽(tīng)設(shè)置在你需要的對(duì)象上  回復(fù)  更多評(píng)論   

          # re: [原創(chuàng)]javascript封裝的Tab類-附源碼 2008-11-04 13:41 xiangmeng

          代碼在哪  回復(fù)  更多評(píng)論   


          只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 三明市| 石泉县| 虞城县| 炉霍县| 吉木乃县| 宣武区| 恩平市| 和田县| 安福县| 东光县| 富顺县| 贞丰县| 蒲城县| 南和县| 博客| 仁布县| 三原县| 潢川县| 象山县| 南皮县| 景东| 安多县| 缙云县| 德州市| 墨江| 道孚县| 满洲里市| 江孜县| 桐庐县| 永平县| 淮安市| 靖边县| 讷河市| 凤凰县| 高雄县| 广宗县| 龙游县| 汉寿县| 兴安县| 咸丰县| 靖西县|