javascript - jQuery 添加两个 CSS 属性值

Question

我试图获取元素的顶部位置和底部边距值。
有效:

var top = -$('elem').postion().top; // lets say its -54
var margin = $('elem').css('margin-top'); // lets say its 0

Bud 我需要为我的动画功能添加这些。所以 top+margin 但 jQuery 给出 -540 px 但它需要返回 -54 px.. 或者当它为负时它只给出 -54-10px 当我需要 -64 px.

有办法解决这个问题吗？我想不出来，这让我很烦!

我的代码:

var top = -$('#id1').position().top;
var margin = $('.scrollable').css('margin-top');

var combine = top+margin;

$('.animate').animate({'margin-top' : combine});

Answer 1

Bud i need to add these up for my animate function. so top+margin but jQuery gives 540 p

css 值是字符串，因此由于您的操作数之一是字符串，因此 + 被解释为连接运算符 (54 + "0"= "540")，不是加法运算符。 (Details)要将它们转换为数字，请使用 parseInt(str, 10) ，例如:

// I believe `top` will already be a number; check and if not, use parseInt here too,
// e.g. var top = -parseInt($('#id1').position().top, 10);
var top = -$('#id1').position().top;

// This will definitely be a string that needs parsing; note that we're assuming
// here that the margin has been given in `px` units.
var margin = parseInt($('.scrollable').css('margin-top'), 10);

// Now this + is an addition, not a concatenation    
var combine = top+margin;

$('.animate').animate({'margin-top' : -combine});