<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQueryåå¸çµæ¢¯éç¹å¯¼èªä»£ç - ãæ´å¤æºç ï¼www.96flw.comã</title>
<script src="js/jquery.min.js"></script>
<script src="js/index.js"></script>
<style>
*{
margin: 0;
padding: 0;
}
body{
height: 6000px;
}
.lift-nav{
position: fixed;
top: 15px;
left: 30px;
display: none;
}
.lift-nav li{
width: 10px;
height: 10px;
text-align: center;
line-height: 10px;
color: #fff;
padding: 10px 10px;
margin-bottom: 8px;
background: aqua;
cursor: pointer;
}
.lift-nav li.current{
background: pink;
}
.t1,.t2,.t3,.t4,.t5,.t6,
.t7,.t8,.t9,.t10,.t11,.t12,
.t13,.t14,.t15,.t16,.t17,.t18,
.t19,.t20,.t21,.t22,.t23,.t24{
width: 800px;
height: 400px;
text-align: center;
line-height: 400px;
background: skyblue;
margin: 100px auto;
font-size: 30px;
color: #fff;
}
span{
display: inline-block;
margin-right:200px;
font-size:50px;
font-weight: 700;
}
.t1{
margin-top: 100px;
}
.t2{
background: pink;
}
.t3{
background: tomato;
}
.t4{
background: grey;
}
.t5{
background: yellow;
}
.t6{
background: seagreen;
}
.t7{
background: Bisque ;
}
.t8{
background: BlueViolet ;
}
.t9{
background: Aqua;
}
.t10{
background: Brown;
}
.t11{
background: Chartreuse;
}
.t12{
background: Crimson;
}
.t13{
background: IndianRed;
}
.t14{
background: GoldenRod;
}
.t15{
background: Fuchsia;
}
.t16{
background: DeepPink ;
}
.t17{
background: YellowGreen;
}
.t18{
background: Turquoise ;
}
.t19{
background: SlateGray;
}
.t20{
background: Salmon;
}
.t21{
background: RoyalBlue ;
}
.t22{
background: PaleVioletRed;
}
.t23{
background: Gold;
}
.t24{
background: Chocolate ;
margin-bottom:500px;
}
</style>
</head>
<body>
<div class="lift-nav">
<ul class="lift">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
<li>E</li>
<li>F</li>
<li>G</li>
<li>H</li>
<li>I</li>
<li>J</li>
<li>K</li>
<li>L</li>
<li>M</li>
<li>N</li>
<li>O</li>
<li>P</li>
<li>Q</li>
<li>R</li>
<li>S</li>
<li>T</li>
<li>W</li>
<li>X</li>
<li>Y</li>
<li>Z</li>
</ul>
</div>
<div class="lift-target">
<div class="t1"><span> è¿æ¯A楼åå¸:å®åº·å¸ð</sapn></div>
<div class="t2"><span> è¿æ¯B楼åå¸:ä¿å®å¸ð</sapn></div>
<div class="t3"><span> è¿æ¯C楼åå¸:é¿æ¥å¸ð</sapn></div>
<div class="t4"><span> è¿æ¯D楼åå¸:ä¸èå¸ð</sapn></div>
<div class="t5"><span> è¿æ¯E楼åå¸:éå·å¸ð</sapn></div>
<div class="t6"><span> è¿æ¯F楼åå¸:ä½å±±å¸ð</sapn></div>
<div class="t7"><span> è¿æ¯G楼åå¸:广å·å¸ð</sapn></div>
<div class="t8"><span> è¿æ¯H楼åå¸:æµ·å£å¸ð</sapn></div>
<div class="t9"><span> è¿æ¯I楼åå¸:æ ð</sapn></div>
<div class="t10"><span>è¿æ¯J楼åå¸:æ±ä»¬å¸ð</span></div>
<div class="t11"><span>è¿æ¯K楼åå¸:ææå¸ð</span></div>
<div class="t12"><span>è¿æ¯L楼åå¸:丽æ±å¸ð</span></div>
<div class="t13"><span>è¿æ¯M楼åå¸:æ¢
å·å¸ð</span></div>
<div class="t14"><span>è¿æ¯N楼åå¸:å京å¸ð</span></div>
<div class="t15"><span>è¿æ¯O楼åå¸:æ ð</span></div>
<div class="t16"><span>è¿æ¯P楼åå¸:èç°å¸ð</span></div>
<div class="t17"><span>è¿æ¯Q楼åå¸:æ¸
è¿å¸ð</span></div>
<div class="t18"><span>è¿æ¯R楼åå¸:æ¥ç
§å¸ð</span></div>
<div class="t19"><span>è¿æ¯S楼åå¸:æ·±å³å¸ð</span></div>
<div class="t20"><span>è¿æ¯T楼åå¸:å°å·å¸ð</span></div>
<div class="t21"><span>è¿æ¯W楼åå¸:æ¦æ±å¸ð</span></div>
<div class="t22"><span>è¿æ¯X楼åå¸:西å®å¸ð</span></div>
<div class="t23"><span>è¿æ¯Y楼åå¸:æ°¸å·å¸ð</span></div>
<div class="t24"><span>è¿æ¯Z楼åå¸:ä¸å±±å¸ð</span></div>
</div>
<script>
$(function(){
LiftEffect({
"control1": ".lift-nav", //侧æ çµæ¢¯ç容å¨
"control2": ".lift", //éè¦éåççµæ¢¯çç¶å
ç´
"target": [".t1",".t2",".t3",".t4",".t5",".t6",".t7",".t8",".t9",".t10",".t11",".t12",".t13",".t14",".t15",".t16",".t17",".t18",".t19",".t20",".t21",".t22",".t23",".t24",], //çå¬çå
容ï¼æ³¨æä¸å®è¦ä»å°å°å¤§è¾å
¥
"current": "current" //éä¸çæ ·å¼
});
})
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>éç¨æµè§å¨ï¼360ãFireFoxãChromeãOperaãå²æ¸¸ãæçãä¸çä¹çª. ä¸æ¯æSafariãIE8å以ä¸æµè§å¨ã</p>
<p>æ´å¤æºç ï¼<a href="http://www.96flw.com/" target="_blank">www.96flw.com</a></p>
</div>
</body>
</html>
jQuery城市电梯锚点导航代码.zip （3个子文件） 
jiaoben7311 js 
index.js 2KB jquery.min.js 91KB
index.html 5KB资源评论
码云笔记
- 粉丝: 3w+
- 资源: 5852
最新资源
- java毕设项目之ssm线上旅行信息管理系统ssm+vue(完整前后端+说明文档+mysql+lw).zip
- 黑马最新Hive存储压缩以及Hive3性能优化PPT
- java毕设项目之ssm新生报到系统+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm小学生课外知识学习网站+vue(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm校园美食交流系统+vue(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm学生公寓管理中心系统的设计与实现+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm学校运动会信息管理系统+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm学生请假系统+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm医院门诊挂号系统+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm学院党员管理系统+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm亚盛汽车配件销售业绩管理统+jsp(完整前后端+说明文档+mysql+lw).zip
- 教师教学质量评价系统项目源代码全套技术资料.zip
- java毕设项目之ssm在线医疗服务系统+jsp(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm游戏攻略网站的设计与实现+vue(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm医院住院管理系统+vue(完整前后端+说明文档+mysql+lw).zip
- java毕设项目之ssm在线云音乐系统的设计与实现+jsp(完整前后端+说明文档+mysql+lw).zip
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
