由于项目不允许引入任何js库，要求全部用原生js写，现在又需要jquery中slideUp和slideDown的效果，求前辈们指导~~
p.s.那如果这个高度需要js动态获取呢？把js写在CSS里好像影响性能，而且如果上面有很多不同的块需要隐藏，每个页面的块都不一样，这样做就很麻烦吧。之前我使用的是：
setTimeout("window.scrollBy(0,document.getElementById('div').getBoundingClientRect().top-10)",0);
这是个搜索框，当他聚焦的时候需要置顶到页面的顶端，但又因为需要在手机上面显示，当一个输入框聚焦的时候手机会弹出一个键盘，弹出这个键盘的同时页面也会自动上移一部分，这个时候这样做就会造成肉眼可见的两次移动，体验非常不好，所以想改一改，求解~~
思路很简单 ：
设置块级元素的CSS属性overflow为hidden，然后动态改变height即可
如果楼主的浏览器支持css3 transition属性，按F12，然后在console里面输入下面代码
var header=document.getElementsByTagName('header')[0];
header.style.transition='height 500ms';
header.style.overflow='hidden';
接着是见证奇迹的瞬间，最后输入下面的代码（请将页面滚动到顶部查看效果）
// slideUp
header.style.height='0';
// slideDown
header.style.height='70px';
知道思路后，实现slideUp和slideDown就很简单，首先设置overflow为hidden，然后通过setTimeout动态改变height就可以了
@大白菜炖豆腐花花
- js写在CSS里影响性能？如果你只的是transition，那完全不必担心，因为它绝对比任何js实现的代码快。而且手机浏览器，基本都支持css3 transition属性，你完全可以使用这新功能。
- 需要做动画的div必须显示指定height，如果没有，计算出高度设回去。
- 上述代码只是一个思想，如果确定用transition，你完全可以将transition代码写在css文件中；如果不用transition，使用传统的setTimeout实现动画，你也可以封装成一个通用的类似jquery slideUp和slideDown的方法。
- 最后，你提到点击搜索框滚动效果不好的问题。原因是键盘弹出后，会把页面往上推。其实可以在键盘弹出之前先将搜索框滚动到顶部，然后键盘弹出后就不会太把页面晚上推了。这个思路是可行的。在IOS中，键盘弹出在input框focus之前；在Android中，键盘弹出在focus之后。所以你需要绑定到不同的事件以确保键盘弹出前去执行滚动搜索框的代码。