函数声明与调用
JavaScript是弱类型语言,声明一个对象的时候用var声明,声明一个函数用function()。
当你需要调用一个函数的时候,首先你需要声明一个函数才能调用,而且需要有函数名。
有参函数与无参函数
有参函数是指定义的函数里面有变量,暂时替代位置用的。一般地,函数声明用形参,函数调用就用实参(用实参代替形参去运行,即传参)。
无参函数就是定义的函数里面没有变量,都是“定值”。
返回值
只有给定return的函数才有返回值,一个函数只有一个返回值,同时会终止函数运行(跳出函数)。
土豆右下角菜单悬浮效果
链式运动
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/new_file.css"/>
<style type="text/css" >
*{
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
font-family: "微软雅黑";
}
.clearfix:after{
content: '';
display: block;
clear: both;
visibility: hidden;
}
#BodyBox{
width: 100%;
position: relative;
overflow: hidden;
background-color: #10172e;
}
#MiniBox{
width: 202px;
height: 50px;
position: absolute;
bottom: 0;
right: 0;
}
#Btn{
width: 202px;
height: 50px;
position: absolute;
right: 0;
top: 0;
}
#btn{
width: 32px;
height: 50px;
position: absolute;
right: 0;
top: 0;
background: url(../img/MiniBtn.png) no-repeat left top;
cursor: pointer;
z-index: 10;
}
#contBox{
width: 202px;
height: 312px;
position: absolute;
right: 0;
bottom: 48px;
overflow: hidden;
}
#off{
width: 9px;
height: 9px;
position: absolute;
right: 14px;
top: 12px;
cursor: pointer;
opacity: 0.6;
}
#off:hover{
opacity: 1;
}
</style>
<script src="js/move.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
window.onload=function(){
var BodyBox=document.getElementById('BodyBox');
BodyBox.style.height=document.documentElement.clientHeight+'px';
var Btn=document.getElementById('Btn');
var btn=document.getElementById('btn');
var contBox=document.getElementById('contBox');
var off=document.getElementById('off');
var MiniBox=document.getElementById('MiniBox');
Btn.style.left=MiniBox.offsetWidth+'px';
contBox.style.height=0+'px';
btn.onclick=function(){
startMove(Btn,{left:0},function(){
startMove(contBox,{height:312});
});
};
off.onclick=function(){
startMove(contBox,{height:0},function(){
startMove(Btn,{left:MiniBox.offsetWidth});
});
};
};
</script>
</head>
<body>
<div id="BodyBox">
<div id="MiniBox">
<img id="Btn" src="img/MiniBtnBG.png"/>
<div id="btn"></div>
</div>
<div id="contBox">
<img id="cont" src="img/cont.png"/>
<img id="off" src="img/off.png"/>
</div>
</div>
</body>
</html>
**
惊艳了时光
**
作者:王华桥