item参数为要改变高度的dom,
maxHight参数为dom的最大高度,
speed参数为改变高度的速度
function addHeight(item,maxHight,speed){
var itemHeight =parseInt( item.style.height.replace(/[a-z]/gi,''));
if(itemHeight<=maxHight){
itemHeight = itemHeight + 1(每次增加改变像素的值);
item.style.height= itemHeight+"px";
setTimeout(function(){addHeight(item);},speed);
}
}
function subHeight(item){
var itemHeight =parseInt( item.style.height.replace(/[a-z]/gi,''));
if(itemHeight>=0{
itemHeight = itemHeight -1(每次减小像素的值);
item.style.height= itemHeight+"px";
setTimeout(function(){subHeight(item);},speed);
}

原生js动态改变dom高度的更多相关文章

  1. 解决js动态改变dom元素属性后页面及时渲染问题

    今天实现一个进度条加载过程,dom结构其实就是两个div <div class="pbar"> <div class="ui-widget-header ...

  2. js动态改变iframe的高度

    js动态改变iframe的高度的写法 〈iframe id="docDetail" width="100%"  height="200"   ...

  3. 【原生js】js动态添加dom,如何绑定事件

    首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...

  4. 原生JS动态添加和删除类

    原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...

  5. js动态改变css伪类样式

    首先我们来看下页面上需要实现的基本效果,如下图所示: 因此我们可以使用如下js代码来试试看,是否能使用js改变伪类?如下代码所示: $(function() { $('.listnav li').cl ...

  6. 原生js动态添加style,添加样式

    原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...

  7. 原生js快速渲染dom节点

    function renderDom(str){ var _div = document.createElement('div'); _div.innerHTML = str; var dom_tem ...

  8. [笔记]原生JS实现的DOM操作笔记

    原生JS实现的DOM一系列操作参考: 原生JavaScript封装DOM库 siblings: 原生JS-查找相邻的元素-siblings方法的实现 addClass,removeClass,hasC ...

  9. js动态改变setInterval的时间

    <!DOCTYPE html> <html> <head> <!--meta name="viewport" content=" ...

随机推荐

  1. 对浏览器css兼容性的学习理解及问题解决汇总

    一.从浏览器内核的角度 来看,浏览器兼容性问题可分为以下三类: 1. 渲染相关:和样式相关的问题,即体现在布局效果上的问题. 2. 脚本相关:和脚本相关的问题,包括JavaScript和DOM.BOM ...

  2. 摩根斯坦利 - 2016年09月8日 面试题 - HashMap

    摩根斯坦利 - 2016年09月8日 面试题: 给定一个 Map<Person, Object> map = new HashMap<Person, Object>(); 放入 ...

  3. php 7 正式发版

    php 7 正式发版 php 在 2015年 12月 3 日 正式发布了 php7 以下是php7的新特性 性能是php5.6的2倍 显著的减少了内存的使用 抽象语法书 64位的支持 提高了异常层次 ...

  4. Windows 7/Vista 开机自动登录

    “Win”+“R”打开命令窗口,输入"control userpasswords2"(不包括引号),或者 “rundll32 netplwiz.dll,UsersRunDll” 回 ...

  5. (转载)JS中的prototype

    原文地址:http://www.cnblogs.com/yjf512/archive/2011/06/03/2071914.html#!comments JS中的phototype是JS中比较难理解的 ...

  6. objective -c 知識点

    那么类别与继承相比,有什么缺点吗?类别不可以声明新的成员变量,而且一旦你定义的方法与原始类中的方法名称相同,那么原始方法将被隐藏起来,因为不是继承结构,你不能在类别中的方法使用super 激活原始类的 ...

  7. 关于scala环境配置详解

    首先从官网下载适合自身电脑配置的scala安装包.scala下载官网网址:http://www.scala-lang.org/download/ 同时scala还有自己集成好的IDE,例如eclips ...

  8. javascript学习笔记(2)

    <html> <head><title>Throwing die</title><script>    var canv_width  = ...

  9. 提醒录入BOM更改原因

    应用 Oracle Bill Of   Materiel 层 Level Function 函数名 Funcgtion Name BOM_BOMFDBOM 表单名 Form Name BOMFDBOM ...

  10. EditText无法失去焦点、失去焦点隐藏软键盘

    很奇怪,我在给EditText设置setOnFocusChangeListener()监听,但是始终未能成功,焦点一直存在,不知其原因,,代码如下: et_username.setOnFocusCha ...