内置函数Math.floor

72 阅读 0 评论 48 点赞

我是靠谱客的博主紧张方盒，最近开发中收集的这篇文章主要介绍内置函数Math.floor，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

向下取整:去比该数小的最近的整数
拼图案例：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.box{
width: 540px;
height: 400px;
border: 2px solid #000;
margin: 0 auto;
position: relative;
}
.box div{
width: 60px;
height: 50px;
position: absolute;
background: green url(img/1.jpg);
transition: 1s;
transform: scale(1);
}
.active{
transform: scale(0);
border-radius: 100%;
}
</style>
</head>
<body>
<img src="img/1.jpg" >
<div class="box">
<!-- <div></div> -->
</div>
<script type="text/javascript">
var box = document.querySelectorAll('.box')[0];
var str = '';
for(var i=0;i<72;i++){
var num = Math.floor(i/9);
var nub = i%9;
//console.log(i,num,nub);
str += '<div style="left:'+(nub*60)+'px;top:'+(num*50)+'px;background-position:-'+(nub*60)+'px -'+(num*50)+'px"></div>';
}
box.innerHTML = str;
var divs = box.querySelectorAll('div');
for(var i=0;i<divs.length;i++){
divs[i].onmouseenter = function(){
// this
this.className = 'active';
}
divs[i].onmouseleave = function(){
// this
this.className = '';
}
}
//console.log(divs)
/*
1. top:0
left:0
0*60
2
top:0
left:60
1*60
3. top:0
left:120 2*60
4. top:0
left:180
5. top:0
left:240
把小数取整 ：
向下取整 : 取比该数小的整数 Math.floor(小数)
3.3
0.4
*/
// var a = 6.3;
// var b = Math.floor(a);
//
// console.log(a,b);
</script>
</body>
</html>