<div id="output"></div>
<script>
function sb(h,s,n){
return h<1?{n,s}:sb(h/2,s+h+h/2,n+1)
}
button.onclick=function(){
var gd=parseInt(input.value)
var res=sb(gd,0,0)
output.innerHTML="小球的回弹次数是"+res.n+"<br />小球走过的路程是"+res.s
}
</script>
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8"/>
<title></title>
<script src="js/jquery-1.8.2.js"></script>
<style type="text/css">
.imgs {
position:absolute
top:-150px
}
.img1{
left:0px
}
.img2{
left:300px
}
.img3
{
left:600px
}
</style>
<script>
$(function () {
$(document).keydown(function (e) {
var height = $(window).height()-150
if(e.keyCode==49||e.keyCode==97)
{
$(".img1").animate({ top: height }, 3000)
}
if (e.keyCode == 50 || e.keyCode == 98) {
$(".img2").animate({ top: height }, 3000)
}
if (e.keyCode == 51 || e.keyCode == 99) {
$(".img3").animate({ top: height }, 3000)
}
setInterval(function () { $(".imgs").css("top", "-150px") }, 1000)
})
})
</script>
</head>
<body>
<img src="images/1.jpg" class="img1 imgs" />
<img src="images/2.jpg" class="img2 imgs" />
<img src="images/3.jpg" class="img3 imgs" />
</body>
</html>