如何使用jquery逐步修改翻译

Question

在我的页面上，我有这一点代码，将减少与滚动数量成比例的网站标题元素的填充。

var $header = jQuery('.site-header'),
padding = parseInt($header.css('padding'));

jQuery(window).scroll(function (event) {
    $header.css({
      padding: padding -$(window).scrollTop()
   });
});

我怎样才能改变它，让它以同样的方式用滚动向下按比例平移元素？

填充似乎很简单，但是我如何写出"transform: translate(0px,0px)“，以便只翻译Y？

*新的*

var $banner = jQuery('.main-banner'),
transform = parseInt($banner.css('transform').split(',')[5]);

jQuery(window).scroll(function (event) {
 $banner.css({
    transform: 'translateY' +$(window).scrollTop()
  });
});   

Answer 1

好了，我终于让它起作用了！

 var $banner = jQuery('.main-banner'),
 transform = parseInt($banner.css('transform').split(',')[5]);

 jQuery(window).scroll(function (event) {
   $banner.css({
   "transform": "translateY("+ transform + $(window).scrollTop() +"px)"
   });
 });

现在有趣的部分是让它在一定数量的滚动后停止:P