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.把以上代碼引進(jìn)你的頁面
復(fù)制代碼 代碼如下:
<script type="text/javascript" src="scrollDoor.js"></script>
2.在頁面的"<body>"標(biāo)簽前加入以下代碼:
復(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ā)類"：鼠標(biāo)經(jīng)過滑動門菜單的類
參數(shù)四 "菜單關(guān)閉類"：鼠標(biāo)滑出滑動門菜單的類
3.頁面中有幾個滑動門就調(diào)用幾次sd函數(shù),只需改變sd調(diào)用的參數(shù),如以上代碼上所展示.
相關(guān)文章
這篇文章主要介紹了淺談js 閉包引起的內(nèi)存泄露問題的相關(guān)資料,需要的朋友可以參考下2015-06-06
這篇文章主要為大家詳細(xì)介紹了js仿新浪微博消息發(fā)布功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
這篇文章主要介紹了javascript使用prototype完成單繼承的方法及示例代碼，有需要的小伙伴參考下2014-12-12
Javascript驗證用戶輸入URL地址是否為空及格式是否正確
這篇文章主要介紹了Javascript驗證用戶輸入URL地址是否為空及格式是否正確,很實用，需要的朋友可以參考下2014-10-10
解構(gòu)賦值允許你使用類似數(shù)組或?qū)ο笞置媪康恼Z法將數(shù)組和對象的屬性賦給各種變量,下面這篇文章主要給大家介紹了關(guān)于JavaScript對象解構(gòu)用法的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-01-01
這篇文章主要介紹了基于JavaScript實現(xiàn)簡單掃雷游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-01-01
用js實現(xiàn)鍵盤記錄，要關(guān)注瀏覽器的三種按鍵事件類型，即keydown，keypress和keyup，它們分別對應(yīng)onkeydown、onkeypress和onkeyup這三個事件句柄。一個典型的按鍵會產(chǎn)生所有這三種事件，依次是keydown，keypress，然后是按鍵釋放時候的keyup。2010-02-02
createTextRange()的使用示例含文本框選中部分文字內(nèi)容
這篇文章主要介紹了createTextRange()的使用示例,需要的朋友可以參考下2014-02-02
這篇文章主要介紹了JS與jQuery判斷文本框還剩多少字符可以輸入的方法,簡單分析了js字符個數(shù)統(tǒng)計的方法,并給出了jQuery字符統(tǒng)計插件textlimit的相關(guān)使用方法示例,需要的朋友可以參考下2018-09-09
Javascript立即執(zhí)行函數(shù)(IIFE)實例詳解
IIFE全拼Imdiately?Invoked?Function?Expression,是一個在定義的時候就立即執(zhí)行的JavaScript函數(shù),這篇文章主要給大家介紹了關(guān)于Javascript立即執(zhí)行函數(shù)的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-04-04