JQuery Alter CSS Value of Left

Question

I am trying to move a div Left a specified amount of pixels I'm using a slider that I got from here:

http://carpe.ambiprospect.com/slider/archive/v1.3/

So from the example my div looks like this:

<div class="horizontal_slider"
        id="your_slider_id"
        style="left: 0px;"
        onmousedown="slide(event, 'your_slider_id',
        'horizontal', 100, 0, 100, 101,
        0, 'your_display_id');" >&nbsp;</div>

And If I adjust left: 0px the slider the move along its line, I've been trying to alter the left from an ajax response that looks like this:

var stateofmindint = $.ajax({ url: "function.php?state=1", async: false }).responseText;

And I try to change its Left style like this:

$("#your_slider_id").css({"left": stateofmindint +"px"});

But for some reason it stays at Left:0px, I've tried to remove the style tag in the div, but to no effect, I also tried referencing the class instead of the ID but nothing seems to be working! I am definitely getting a value everytime through ajax. Any advice would help thank you!

Answer 1

missing a "+" for your concatenation? looks like your syntax is off

css({"left": stateofmindint +"px"});

should be?

css({"left:" + stateofmindint +"px"});

Answer 2

Check with an alert/console.log what's the response of your ajax script or try setting "stateofmindint" to a known value in code to test what part has the bug.

Answer 3

Theres something weird going on. On that page you link I tried using firebugs console to see the sliders left value with the following

$("#horizontal_slider_2").css("left", "30px");

But jQuery returns null with that selector. The following works:

document.getElementById('horizontal_slider_2').style.left = '30px';

So theres some bug going on with jQuery or that slider code