CODEWITHSUNDEEP
jquerycssbackground-color
user3142531
user3142531

Reputation: 21

JQuery changing css background color

i just stared working with JQuery for the first time and i have a simple question about changing css, this is my current code but i would like to be able to prompt for the color how can this be achieved?

$(document).ready(function() {
    $("#change").click(function() {
        $("#container").css("background-color", "blue");
});

ive tried this:

<input id="colorInput" type="text"/>

$(document).ready(function() {
    $("#change").click(function() {
        $("#container").css("background-color", #colorInput);
});

And alot of other ways but nothing seems to work.

Upvotes: 0

Views: 3032

Answers (4)

Himanshu
Himanshu

Reputation: 1

created something on jsfiddle.

check the link : http://jsfiddle.net/SE5R2/2/

$(document).ready(function () { $('#change').click(function () { $('#box').css({ 'background-color': '#' + $('#color').val() }); }); });

Upvotes: 0

Amit
Amit

Reputation: 15387

If your colorinput is like as #FF00AA then use as below 

 $("#container").css("background-color", $("#colorInput").val());

else use as below:

 $("#container").css("background-color", "#"+$("#colorInput").val());

Upvotes: 0

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

try 

$(document).ready(function() {
$("#change").click(function() {
$("#container").css("background-color", $("#colorInput").val());
});

You can get the value from that input using

$("#colorInput").val()

Upvotes: 1

MysticMagicϡ
MysticMagicϡ

Reputation: 28823

Change

$("#container").css("background-color", #colorInput);

to

$("#colorInput").css("background-color", "#ff0000");

id or class of element to be effected will be in selector.

Here is a fiddle.

Upvotes: 1

Related Questions