Increment css top property using jquery

Question

I have the following div :

What is the best way to

Answer 1

You can use the parseFloat function to get only the initial numeric part and convert it from a string to a number. For example:

var n = $('#new');
n.css('top', (parseFloat(n.css('top')) + 10) + 'px');

As a side note, if you want to change multiple elements' positions all at once, that could be:

$('.someClass').css('top', function(i, v) {
    return (parseFloat(v) + 10) + 'px';
});

But if you are just trying to animate an element over time, take a look at jQuery's .animate method.