JavaScript實(shí)現(xiàn)多個(gè)重疊層點(diǎn)擊切換效果的方法
更新時(shí)間：2015年04月24日 12:17:34 作者：休閑生活文化
這篇文章主要介紹了JavaScript實(shí)現(xiàn)多個(gè)重疊層點(diǎn)擊切換效果的方法,實(shí)例分析了javascript實(shí)現(xiàn)點(diǎn)擊切換效果的相關(guān)技巧,需要的朋友可以參考下
本文實(shí)例講述了JavaScript實(shí)現(xiàn)多個(gè)重疊層點(diǎn)擊切換效果的方法。分享給大家供大家參考。具體如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>三個(gè)層重疊，點(diǎn)擊可切換</title>
<script type="text/javascript">
function $(obj){
return document.getElementById(obj);
}
function change(n){
for (var i=1;i<4;i++){
if(n==i){
$("a"+i).style.zIndex="100";
}else{
$("a"+i).style.zIndex="0";
}
}
}
</script>
</head>
<body>
<div id="a1"
style="position:absolute;left:100px;top:100px;width:100px;height:100px;
background-color:#ddeeff;z-index:1" onclick="change('1')" >
</div>
<div id="a2"
style="position:absolute;left:150px;top:130px;width:100px;height:100px;
background-color:#eeffdd;z-index:2" onclick="change('2')">
</div>
<div id="a3"
style="position:absolute;left:200px;top:160px;width:100px;height:100px;
background-color:#ffddee;z-index:3" onclick="change('3')">
</div>
<div>http://www.dbjr.com.cn/</div>
</body>
</html>
希望本文所述對大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
返回字符串的字節(jié)長度 檢查表單是否符合規(guī)定的長度 等表達(dá)驗(yàn)證函數(shù)2009-04-04
JavaScript使用指針操作實(shí)現(xiàn)約瑟夫問題實(shí)例
這篇文章主要介紹了JavaScript使用指針操作實(shí)現(xiàn)約瑟夫問題,實(shí)例分析了javascript模擬數(shù)組指針操作的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
以下頁面在運(yùn)行中,調(diào)試輸出的永遠(yuǎn)是alter('1'),原因是按照頁面加載從上至下的順序,同名的方法以最后一個(gè)為準(zhǔn).2009-01-01
今天小編就為大家分享一篇解決layui表格內(nèi)文本超出隱藏的問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
刷新禁止用F5鍵刷新禁止右鍵這些在某些特殊情況下還是比較實(shí)用的，下面有個(gè)不錯(cuò)的示例，感興趣的朋友可以參考下2013-09-09
在Three.js中物體通常是通過創(chuàng)建"網(wǎng)格"(Mesh)對象來描述的,下面這篇文章主要給大家介紹了關(guān)于three.js修改物體位置的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-11-11
這篇文章主要介紹了JS截取與分割字符串常用技巧,以實(shí)例形式分析你了JavaScript針對字符串的截取與分割常用函數(shù)的定義、功能及使用技巧,并補(bǔ)充分析了substr和substring方法的區(qū)別,需要的朋友可以參考下2015-11-11
js與jquery分別實(shí)現(xiàn)tab標(biāo)簽頁功能的方法
這篇文章主要介紹了js與jquery分別實(shí)現(xiàn)tab標(biāo)簽頁功能的方法,結(jié)合實(shí)例形式對比分析了javascript與jQuery分別實(shí)現(xiàn)tab標(biāo)簽功能的操作技巧,需要的朋友可以參考下2016-11-11
Javascript實(shí)現(xiàn)滾動(dòng)圖片新聞的實(shí)例代碼
這篇文章主要介紹了Javascript實(shí)現(xiàn)滾動(dòng)圖片新聞的實(shí)例代碼。需要的朋友可以過來參考下，希望對大家有所幫助2013-11-11
關(guān)于JavaScript對象的動(dòng)態(tài)選擇及遍歷對象
本文為大家介紹下JavaScript對象的兩點(diǎn)：動(dòng)態(tài)選擇方法及屬性、遍歷對象屬性和方法,需要的朋友可以參考下2014-03-03