<something>.stop().animate(
    { 'top' : 10 }, 10
);

var thetop = 'top';
<something>.stop().animate(
    { thetop : 10 }, 10
);

obj = { thetop : 10 };
obj = { "thetop" : 10 };

var thetop = "top";

// create the object literal
var aniArgs = {};

// Assign the variable property name with a value of 10
aniArgs[thetop] = 10;

// Pass the resulting object to the animate method
<something>.stop().animate(
    aniArgs, 10
);

var thetop = "top",
    obj = { [thetop]: 10 };

console.log(obj.top); // -> 10

var obj = {
  [key]: value
}

<something>.stop().animate({
  [thetop]: 10
}, 10)

var key = 'top';
$('#myElement').animate(
   (function(o) { o[key]=10; return o;})({left: 20, width: 100}),
   10
);

var thetop = 'top';
<something>.stop().animate(
    { [thetop] : 10 }, 10
);

var thetop = 'top';
<something>.stop().animate(
    { thetop : 10 }, 10
);

var thetop = 'top';
var config = { thetop : 10 }; // config.thetop = 10
<something>.stop().animate(config, 10);

var thetop = 'top';
var config = { [thetop] : 10 }; // config.top = 10
<something>.stop().animate(config, 10);

var thetop = 'top';
var config = (
  obj = {},
  obj['' + thetop] = 10,
  obj
); // config.top = 10
<something>.stop().animate(config, 10);