收获到了什么?
- 定时器的使用方法
setInterval(函数,时间)
使用之前可以把定时器封装在一个变量里面 var timer = setInterval()
- 停止定时器的方法
clearInterval()
括号里面直接写变量名称就好了 clearInterval(timer)
- Math.random() 方法,只能随机0-1之间的浮点数字
- Math.floor() 向下取整方法
Math.floor(Math.random() * 7)
这样取的数字就是不小于7大于0的整数
- 昨天的项目做完了,最后一块状态切换的代码没有按照教程来,用的是自己的方法
- 用到了阻止事件冒泡方法
对于收获的想法?
明天的打算?
- 继续找JavaScript项目来做
- JavaScript 的键盘事件
- 用jQuery再把今天的项目写一遍
项目的原js代码:
window.onload = function(){
//拖曳效果
var otitle = document.getElementById("title"),
colse = document.getElementById("colse");
otitle.onmousedown = darg;
colse.onclick = function(){
document.getElementById("box").style.display = 'none';
}
//下拉效果
var obox = document.getElementById("select"),
omenu = document.getElementById("select_menu"),
olis = omenu.getElementsByTagName("li"),
otext = document.getElementById("select_text"),
oicon = document.getElementById("icon");
obox.onclick = function(event){
event = event || window.event;
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble;
}
omenu.style.display = 'block';
}
for(i = 0;i<olis.length;i++){
olis[i].onclick = function(){
var olis_text = this.innerText,
olis_class = this.className;
otext.innerText = olis_text;
oicon.className = "icon "+olis_class;
omenu.style.display = 'none';
}
}
document.onclick = function(){
omenu.style.display = 'none';
}
}
//单击的时候触发的操作
function darg(event){
var box = document.getElementById("box"),
x = event.clientX - box.offsetLeft,
y = event.clientY - box.offsetTop;
document.onmousemove = function(event){
fnMove(event,x,y);
}
document.onmouseup = function(){
document.onmousemove = null;
document.onmouseup = null;
}
}
//移动的时候触发的操作
function fnMove(event,postX,postY){
var box = document.getElementById("box"),
l = event.clientX - postX,
t = event.clientY - postY,
winW = document.documentElement.clientWidth,
winH = document.documentElement.clientHeight;
maxW = winW - box.offsetWidth,
maxH = winH - box.offsetHeight;
if(l<0){
l=0;
}else if(l>maxW){
l=maxW;
};
if(t<0){
t=0;
}else if(t>maxH){
t=maxH;
}
box.style.left = l + 'px';
box.style.top = t + 'px';
}
网友评论