CODEWITHSUNDEEP
jquerycssvariables
Vincent1989
Vincent1989

Reputation: 1657

Jquery CSS with variable?

I have a Jquery line that adjust the background position of an image:

$(".container").css('background-position', '10px 10px' );

However I would want this to be dynamic by introducing a variable, but I can't seem to get it right:

var backgroundX= 100;

$(".container").css('background-position', ''backgroundX+"px" "10px"'' );

Upvotes: 0

Views: 641

Answers (3)

Daan
Daan

Reputation: 2799

In Javascript you connect variables with strings with the + sign. You simply add the variable, then you write the + sign and then the string.

As you mentioned the correct line without variable is:

$(".container").css('background-position', '10px 10px');

Because your variable is on the start of the string you have to just easily add it before the string and remove the 10 before px so that the 10 gets replaced by the variable (which you then both connect with the + sign):

$(".container").css('background-position', backgroundX + 'px 10px');

Upvotes: 2

Yograj Gupta
Yograj Gupta

Reputation: 9869

Try it. Just concatenate backgroundX variable with 'px 10px' string.

 $(".container").css('background-position', backgroundX+ "px 10px" );

Upvotes: 2

Sidhhraj Maharaul
Sidhhraj Maharaul

Reputation: 56

var backgroundX= 100;

$(".container").css("background-position", "'+backgroundX+'px 10px" );

Upvotes: 0

Related Questions