<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS幻灯代码</title>
<script type="text/javascript">
window.onload = function (){
flag = 0;
obj1 = document.getElementById("slider");
obj2 = document.getElementsByTagName("li");
for (var num = 0; num < obj2.length; num++) {
obj2[num].onmouseover = function ()
{ turn(this.innerHTML); }
}
}
function turn(value){
if (value != null) {
flag = value - 2; }
/*if (flag < obj2.length - 1)
{flag++; }
else flag = 0; */
obj1.style.top = flag * (-320) + "px"; //top 属性设置一个定位元素的上外边距边界与其包含块上边界之间的偏移。
}
</script>
<style type="text/css">
#wrap {
height:320px;
width: 320px;
overflow: hidden;
position: relative;
overflow: hidden;
}
#wrap ul {
list-style: none;
position: absolute;
top: 200px;
left:250px;
}
#wrap li {
margin-left:2px;
opacity: .3;
filter: alpha(opacity=30);
text-align: center;
line-height: 20px;
font-size: 15px;
height: 20px;
width: 20px;
background-color:#666;
float: left;
border-radius:3px;
cursor:pointer;
}
#slider {
position: absolute;
top:0px;
left: 0px;
}
#slider img {
float: left;
border: none;
}
</style>
</head>
<body>
<div id="wrap" align="center" >
<div id="slider">
<a target="_blank" >
<img src="img/20121225105638206.jpg" /></a>
<a target="_blank">
<img src="img/ff40e256-86b7-4755-b6b5-38762857f201.jpg"/></a>
<a target="_blank" >
<img src = "img/20130513091049491.jpg" /></a>
</div>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</body>
</html>
求解释turn函数什么意思。。。
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
- 邀请回答
-
2条回答
- Go 旅城通票 2016-05-04 01:12关注
obj1.style.top = flag * (-320) + "px"; 主要这句设置slider的top属性,实现里面图片的展示
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥15 求解 yolo算法问题
- ¥15 虚拟机打包apk出现错误
- ¥30 最小化遗憾贪心算法上界
- ¥15 用visual studi code完成html页面
- ¥15 聚类分析或者python进行数据分析
- ¥15 逻辑谓词和消解原理的运用
- ¥15 三菱伺服电机按启动按钮有使能但不动作
- ¥15 js,页面2返回页面1时定位进入的设备
- ¥50 导入文件到网吧的电脑并且在重启之后不会被恢复
- ¥15 (希望可以解决问题)ma和mb文件无法正常打开,打开后是空白,但是有正常内存占用,但可以在打开Maya应用程序后打开场景ma和mb格式。