javascript 通用滑動門tab類
更新時間：2008年03月28日 23:03:37 作者：
滑動門JS并封裝成類
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
源代碼：
復(fù)制代碼 代碼如下:
function scrollDoor(){
}
scrollDoor.prototype = {
sd : function(menus,divs,openClass,closeClass){
var _this = this;
if(menus.length != divs.length)
{
alert("菜單層數(shù)量和內(nèi)容層數(shù)量不一樣!");
return false;
}
for(var i = 0 ; i < menus.length ; i++)
{
_this.$(menus[i]).value = i;
_this.$(menus[i]).onmouseover = function(){
for(var j = 0 ; j < menus.length ; j++)
{
_this.$(menus[j]).className = closeClass;
_this.$(divs[j]).style.display = "none";
}
_this.$(menus[this.value]).className = openClass;
_this.$(divs[this.value]).style.display = "block";
}
}
},
$ : function(oid){
if(typeof(oid) == "string")
return document.getElementById(oid);
return oid;
}
}
使用方法：
1.把以上代碼引進你的頁面
復(fù)制代碼 代碼如下:
<script type="text/javascript" src="scrollDoor.js"></script>
2.在頁面的"<body>"標簽前加入以下代碼:
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var SDmodel = new scrollDoor();
SDmodel.sd([菜單id數(shù)組],[顯示層id數(shù)組],"菜單觸發(fā)類","菜單關(guān)閉類");
SDmodel.sd([菜單id數(shù)組2],[顯示層id數(shù)組2],"菜單觸發(fā)類","菜單關(guān)閉類");
SDmodel.sd([菜單id數(shù)組3],[顯示層id數(shù)組3],"菜單觸發(fā)類","菜單關(guān)閉類");
</script>
其中sd方法中的參數(shù)為：
參數(shù)一 [菜單id數(shù)組]：滑動門菜單的id
參數(shù)二 [內(nèi)容id數(shù)組]：顯示和隱藏滑動內(nèi)容層的id
參數(shù)三 "菜單觸發(fā)類"：鼠標經(jīng)過滑動門菜單的類
參數(shù)四 "菜單關(guān)閉類"：鼠標滑出滑動門菜單的類
3.頁面中有幾個滑動門就調(diào)用幾次sd函數(shù),只需改變sd調(diào)用的參數(shù),如以上代碼上所展示.
相關(guān)文章
JS實現(xiàn)單張或多張圖片持續(xù)無縫滾動的示例代碼
這篇文章主要介紹了JS實現(xiàn)單張或多張圖片持續(xù)無縫滾動效果，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-05-05
javascript 限制輸入和粘貼(IE和火狐3.x下測試通過)
限制輸入和粘貼的js代碼
2008-11-11 
本篇文章主要介紹了淺談PDF.js使用心得，pdf.js 是一個技術(shù)原型主要用于在 HTML5 平臺上展示 PDF 文檔，無需任何本地技術(shù)支持。非常具有實用價值，需要的朋友可以參考下
2018-06-06 
js 截取或者替換字符串中的數(shù)字實現(xiàn)方法
下面小編就為大家?guī)硪黄猨s 截取或者替換字符串中的數(shù)字實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-06-06 
這篇文章主要介紹了自己封裝的javascript事件隊列函數(shù)版,兼容了大部份瀏覽器,需要的朋友可以參考下
2014-06-06 
這篇文章主要為大家介紹了JavaScript數(shù)據(jù)扁平化，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
2021-12-12 
項目實踐之javascript技巧...
2007-12-12 
js生成1到100的隨機數(shù)最簡單的實現(xiàn)方法
在本篇文章里小編給大家整理了關(guān)于js生成1到100的隨機數(shù)最簡單的實現(xiàn)方法，有需要的朋友們可以學習下。
2020-02-02 
這里給大家分享的是本人近期學習與使用javascript之后總結(jié)出來的一些經(jīng)驗和心得，雖然目前只有5點，但以后會慢慢更新，希望對大家能有所幫助。
2015-01-01