Javascript 带滑动过渡的移动div

我有一个有视频背景的页面和一个有一些文本的div，我想在页面中央放一个按钮，这样当用户点击它时，当前div（文本）会随着css转换向上滑动，而另一个div会随着相同的转换显示

我只想移动背景固定的div

---

实现此效果的最佳方法是什么？

如果DIV中的文本处于绝对位置，则应尝试

设置动画

：

$('#your_div_id').animate({'top':some_value, 'opacity':0},time);

如果需要完全隐藏DIV，则需要为

某些值指定负值
 
var oT=$（'#old'），
nT=$（“#新”）.css({
顶部：'+=50'，
不透明度：0
});
$（'button'）。一个（'click'，函数（）{
$（此）.attr（“已禁用”、“已禁用”）；
动画({
顶部：'-=50'，
不透明度：0
}，函数（）{
新台币({
顶部：'-=50'，
不透明度：1
});
});
});
html，
身体{
宽度：100%；
身高：100%；
}
#容器{
宽度：100%；
身高：100%；
背景：url(http://www.quilabytes.com/wp-content/uploads/2013/06/light_shadow_blur_background_46792_1920x1200.jpg)无重复中心；
位置：相对位置；
}
钮扣{
保证金：0自动；
宽度：100px；
位置：绝对位置；
左：50%；
左边距：-50px；
最高：65%；
}
#老,，
#新的{
宽度：100%；
位置：绝对位置；
最高：30%；
}
p{
字体系列：helvetica；
颜色：#fff；
文本阴影：0px 0px 20px#000；
字体大小：40px；
文本对齐：居中；
}

旧文本

新文本

点击我！
看起来像你的新电脑。您应该发布您的代码尝试，如果可能的话，还应该发布一个JSFIDLE。向我们展示您迄今为止所做的尝试以及您的困境！谢谢，当我在html中插入它时，它不起作用，在这个过程中我有错误吗？我的html CSS和Javascript一定会遵循所有的。你没有正确加载jQuery。将其用于URL:
http://code.jquery.com/jquery-1.10.2.min.js
哦，是的，我忘了。谢谢你，希瓦姆，我很感激你。还有一件事。我可以用图片代替按钮吗？