title: Jquery multi css using variables
body: <p>I am having an issue with this jquery css:</p>
  
  <p>Like this it works in all browsers but ie9:</p>
  
  <pre><code>  $(".%id%faderbox").css({
      "background-image": "url("+bgimage+")",
      "padding": "%id=xtrapadding%px",
      "height": dooheight,
      "width": doowidth,
      "border": doofaderborder
   });
  </code></pre>
  
  <p>dooheight and doowidth are variables declared further up the page, and always return ie: 133px</p>
  
  <p>note: the px on the end.
  note: not encloded like: "133px"</p>
  
  <p>now the issue with ie9 seems to be that it does not like the width and height values without the enclosing qoutes ""</p>
  
  <p>So.. ok i thought, i will just do this for example:</p>
  
  <pre><code>"width": '"' + doowidth + '"',
  </code></pre>
  
  <p>But this does not work in any browser, even though an alert test clearly shows the value of doowidth now returns: "133px" instead of 133px</p>
  
  <p>hard coding: "width": "133px", works in all browsers including ie 9</p>
  
  <p>I cant understand why it breaks in all browsers with: </p>
  
  <pre><code>"width": '"' + doowidth + '"',
  </code></pre>