一个层动态放大的例子的一些知识点
2011-09-09 09:38
204 查看
这个其实很简单,只是自己平时疏于练习,会忘记,现在记下来。先看代码:
下来是JS代码:
知识点一:var showIntrevalId=setInterval("inc()",100),clearInterval(showIntervalId).
首先,这个两个方法一定要配对使用,其次,这两个方法要放在不同的函数里,最后,setInterval的第一个参数是要调用的函数,
第二个参数是每次调用的频率(时间为单位,毫秒)。
知识点二:parseInt(string, radix)函数可解析一个字符串,并返回一个整数。
上面parseInt(oldheight,10),是吧oldheight转换为十进制,其中oldheight初始值为5px
<div id="div1" style="width:5px;height:5px;border-style:solid;border-color:Red;border-width:1px;background-color:Yellow;overflow:hidden;"> 案例:点击按钮层动态变大。提示:英文字母连续单词不会在中间自动换行的陷阱。 案例:点击按钮层动态变大。提示:英文字母连续单词不会在中间自动换行的陷阱。 点击【动态放大】按钮,文字会动态的变大。 </div> <input type="button" value="动态放大" onclick="showDiv();" />
下来是JS代码:
var showIntervalId; function showDiv() { showIntervalId = setInterval("inc()", 100); } function inc() { var div1 = document.getElementById('div1'); var oldwidth = div1.style.width; oldwidth = parseInt(oldwidth, 10);//这个parseInt应该是吧oldwidth转换为整数吧 var oldheight = div1.style.height; oldheight = parseInt(oldheight, 10); if (oldwidth >= 200) {//如果宽度涨到了200,停止计时器、停止继续动画长大 clearInterval(showIntervalId); //停止计时器 } oldwidth += 10; oldheight += 10; div1.style.width = oldwidth + "px"; div1.style.height = oldheight + "px"; }
知识点一:var showIntrevalId=setInterval("inc()",100),clearInterval(showIntervalId).
首先,这个两个方法一定要配对使用,其次,这两个方法要放在不同的函数里,最后,setInterval的第一个参数是要调用的函数,
第二个参数是每次调用的频率(时间为单位,毫秒)。
知识点二:parseInt(string, radix)函数可解析一个字符串,并返回一个整数。
上面parseInt(oldheight,10),是吧oldheight转换为十进制,其中oldheight初始值为5px
相关文章推荐
- osg例子osgpick的一些知识点的理解
- 关于指针及动态内存的一些知识点
- 一些动态效果和其他的小知识点(来自小投票网站项目)
- CString转换为int、long、char*型的一些函数和例子
- WCF的一些基本知识点
- jqzoom插件图片放大功能的一些BUG
- 搜集整理一些Cron表达式例子
- Android6.0动态权限申请步骤以及需要注意的一些坑
- CGLib动态代理原理及实现的一个小例子
- MC的一些具体的应用的例子的总结
- crontab 的一些例子
- 内存对齐的原理,作用,例子以及一些规划(中英文说明,适用sizeof结构体)
- java的一些知识点
- 对Android Handler Message Looper常见用法,知识点的一些总结
- 总结一些前端的知识点
- c++知识点总结--new的一些用法
- sql 子查询的一些例子
- ASP.NET 2.0 中动态添加 GridView 模板列的例子
- 复习Linux中的一些零碎知识点
- oracle存储过程的动态游标的简单例子