CODEWITHSUNDEEP
javascriptjqueryhtmlcssstylesheet
Ryan
Ryan

Reputation: 1395

jQuery: is it possible to get an array of css values?

I'm looking to style the radio and checkbox form elements by replacing the form element with an image. I want to be able to style the checkbox and have jquery make an array of the values.

Something like this:

input[type=checkbox] {
  width:13px;height:13px;
  /*.css() can't take the shorhand background property I don't think*/
  background-image:url(assets/img/bg_form_checkbox.gif);
  background-repeat:no-repeat;
  background-position:50% 50%;
  position:relative;
}

Is there a way to store the css values in an array and iterate through them and assign them to a span?

$("input[type=checkbox]").after('<span style="'+cssValuesHere+'"></span>');

Upvotes: 2

Views: 491

Answers (2)

bjornd
bjornd

Reputation: 22951

var cssValues = {
    width:'13px',
    height:'13px',
    background-image: 'url(assets/img/bg_form_checkbox.gif)',
    background-repeat: 'no-repeat',
    background-position: '50% 50%',
    position:' relative'
}

$('<span/>').css(cssValues).insertAfter("input[type=checkbox]");

Upvotes: 1

nex2hex
nex2hex

Reputation: 82

Try to use this:

.css_class {
  width:13px;height:13px;
  /*.css() can't take the shorhand background property I don't think*/
  background-image:url(assets/img/bg_form_checkbox.gif);
  background-repeat:no-repeat;
  background-position:50% 50%;
  position:relative;
}

$(".css_class").after('<span class="css_class"></span>');

Upvotes: 3

Related Questions