Question

I was wondering how to use gathered variables within the jQuery animate function. Here is the code that I was working on:

var size = $("#myTwitter").width();

    var slidelength = (686 - size)*(-1);

    var slidelength = slidelength.toString();

    var margin = "'margin-left:' '";

    var after = "px'";

    var output = margin.concat(slidelength, after);

    $("#twitWrap").mouseenter(function(){

        $("#myTwitter").stop(0).animate(output, 5000);

    });

    $("#twitWrap").mouseleave(function(){

        $("#myTwitter").stop(0).animate({"margin-left": "0px"}, 5000);

    });

as you can tell its not working – still no idea why though.

Answer 1

You don’t need to do anything special.

$("#myTwitter").stop(0).animate({"margin-left":  slidelength }, 5000);

If "margin-left" needs to be dynamic, you can do…

var options = {};

options[property] = value;

$("#myTwitter").stop(0).animate(options, 5000);