2013年7月1日
16.仿微博效果
摘要： 点击按钮，在页面中显示输入框中的内容，内容显示效果为：1.内容的高度从0到相应内容高度；//运动 var iHeight=oLi.offsetHeight;//用一个变量储存内容应有的高度。 oLi.style.height='0';//再将高度设置为0；然后通过运动，让高度从0变为变量中储存的高度；2,内容的透明度从0到100；使用完美运动框架；js代码：//导入完美运动框架；css: 阅读全文
posted @ 2013-07-01 12:12 猫多多 阅读(272) 评论(0) 推荐(0)
2013年6月27日
15，完美运动框架；
摘要： 由任意值运动框架——>链式运动框架（start(obj,attr,iTarget,fnEnd),多添加了一个函数，用来在对象运动完成后执行该函数，达到分层次运动的效果；）——>完美运动框架；完美运动框架与之前运动框架的区别与完善：1，运用了json，即json{attr:iTarget},用for in遍历json，使对象的每一个属性能够同步运动。2，用var bStop=true;来判断对象的每一个属性是否都达到了目标点，如果有一个不达到，则bStop=false；当全部达到时，关闭定时器；var bStop=true;for(```in json){ timer=setInte 阅读全文
posted @ 2013-06-27 22:21 猫多多 阅读(364) 评论(0) 推荐(0)
2013年6月23日
14.js仿flash图片轮播练习；
摘要： 通过getByClass获取各所需元素；function getByClass(oParent,sClass){ var aEle=oParent.getElementsByTagName('*'); var arr=[]; for(var i=0;i 加载图片说明…… 计算图片数量…… ... 阅读全文
posted @ 2013-06-23 22:47 猫多多 阅读(409) 评论(0) 推荐(0)
13，多个div运动，obj.timer,obj.alpha,getStyle()任意值变化的运动，透明度运动与其他值运动的区别；
摘要： 1，多个div变宽：obj.timer。给每一个对象加一个timer.防止共用一个timer时前一个对象运动卡在中途的情况发生；多物体运动：1没有共用的属性；透明度变化时，var alpha=30;定义alpha变量来存储透明度初始值，然后给每一个div添加一个alpha属性，obj.alpha,目的是为防止div强夺同一个alpha，导致透明度变到一半终止，无法到达目标值。function startMove(obj, iTarget){ clearInterval(obj.timer); obj.timer=setInterval(function (){ var... 阅读全文
posted @ 2013-06-23 21:19 猫多多 阅读(931) 评论(0) 推荐(0)
2013年6月20日
12,缓冲运动。匀速运动停止条件
摘要： 缓冲运动：iSpeed=(iTarget-oDiv.offsetLeft)/7;速度离目标点越远，速度越大，离目标点越近速度越小；只支持1px是最小单位，没有0.5px。所以当iSpeed为小数时如（0.7），oDiv.style.Left=oDiv.offsetLef+iSpeed+'px';会把小数部分去掉，Div的位置永远到不了目标点；所以用Math.ceil(iSpeed);向上取值；当速度为负，则用Math.floor(iSpeed);向下取值；<body><input type="button" value="开始运动 阅读全文
posted @ 2013-06-20 16:36 猫多多 阅读(350) 评论(0) 推荐(0)
11,运动基础框架（匀速）
摘要： 匀速运动（框架）：给物体不断加速度，用setInterval来循环执行；用timer来储存setInterval返回的id值；clearInterval(timer);清除定时器，让运动停止。用if else 来判断运动是移动还是停止；每执行一次事件（点击按钮）要清楚一次定时器，防止定时器叠加使速度不断加快；<body> <input id="btn1" type="button" value="开始运动" onclick="startMove()" /><div id="d 阅读全文
posted @ 2013-06-20 14:23 猫多多 阅读(272) 评论(0) 推荐(0)
2013年6月19日
10.table.排序，arr.sort();appendChild();
摘要： table排序：先用sort对tbody中的tr进行排序，然后用appendChild将每个tr按排好的顺序插入到父节点中；appendChild：此时分两步操作：1，先将tr从原父元素中删除，2再将tr插入到父元素末尾；sort:是数组的方法；arr.sort；而通过oTab.tBodies[0].rows获取的是tr元素集合；元素集合只有length.这个类似数组的属性，但无sort，splice等数组的方法；因此要讲元素集合转换成数组，方法如下：var arr=[];//定义一个空数组；for(var i=0;i<oTab.tBodies[0].rows.length;i++){ 阅读全文
posted @ 2013-06-19 23:09 猫多多 阅读(631) 评论(0) 推荐(0)
9.js.table搜索str.search();str.toLowerCase();str.split();
摘要： table搜索记录：1搜索时不分字符串大小写：用str.toLowerCase(); 2.搜索字符串中包含某字段：str.search(字段);它会返回该字段在字符串中的位置，如果字符串中无该字段，则返回-1； 3.搜索字段中含空格：用str.split(' ');将字符串用空格分开；例子：遍历tbody里面的tr。比较tr里内容tr.innerHTML与txt输入框里文本字符串是否有相同的地方；<body>姓名：<input id='txt1'type='text'/><input id='btn1' 阅读全文
posted @ 2013-06-19 22:26 猫多多 阅读(513) 评论(0) 推荐(0)
8,js，table.js插入删除行appendChild
摘要： 练习：table添加删除一行；添加子元素用：appendChild; 为元素添加内容用：object.innerHTML，oTd.innerHTML='<a href="javascript:;">删除</a>'删除元素用：父节点.removeChild(子节点)添加，删除都是操作tbody里面的tr;添加行的序号:用oTab.tBodies[0].rows.length+1数组序号加1来作为行的序号；每加一行加1.为了使删除某一行后，序号依旧按元顺序增加，所以用一个变量id来储存当前序号，那么即便删除一行后，序号还是不变，当再加一行 阅读全文
posted @ 2013-06-19 21:19 猫多多 阅读(1520) 评论(0) 推荐(0)
7，js操作table.tBodies,tHead,tFoot,rows.cells
摘要： js操作table,获取tbody:tBodies, 获取thead:tHead; 获取tfoot:tFoot; 获取tr:rows; 获取td:cells;鼠标移入变色：<table> <thead> <td>序号</td> <td>姓名</td> <td>年龄</td> <td>操作</td> </thead> <tbody> <tr> <td>1</td> <td>刘一</td> < 阅读全文
posted @ 2013-06-19 20:44 猫多多 阅读(1850) 评论(0) 推荐(0)