I'm trying to get an inline property of an element using jquery: width: auto. As soon as I get the width, .width() returns a px value instead of auto. This is an example of what I need:

I've an img with this inline style setted:

<img id='image' style='position: absolute; height: 200px; width: auto; top: 25px; left: 50px;' src=''/>

I need to wrap that image in an a, to make the image clickable. I need also to get the image style and move it to the anchor tag:

//--- get height, width and entire style
var imgHeight = $("#image").height();
var imgWidth = $("#image").width();
var imgStyle = $("#image").attr("style");

//---remove inline style from the img
$("#image").removeAttr("style");

//--- create the <a>, add the inline style
var anch = $("<a href='#'></a>");
$(anch).attr("style", imgStyle);

//--- add back to the img it's width and height
//--- the problem is here: imgWidth does not contain 'auto'
$("#image").css({"width" : imgWidth, "height" : imgHeight});

//--- wrap the img
$("#image").wrap(anch);

here's a fiddle with the code: /

any idea? How can I get the auto out of that inline style? I need to give width: auto to the image instead of a px value.

Thanks in advance, best regards

I'm trying to get an inline property of an element using jquery: width: auto. As soon as I get the width, .width() returns a px value instead of auto. This is an example of what I need:

I've an img with this inline style setted:

<img id='image' style='position: absolute; height: 200px; width: auto; top: 25px; left: 50px;' src='http://tinyurl./k8ef66b'/>

I need to wrap that image in an a, to make the image clickable. I need also to get the image style and move it to the anchor tag:

//--- get height, width and entire style
var imgHeight = $("#image").height();
var imgWidth = $("#image").width();
var imgStyle = $("#image").attr("style");

//---remove inline style from the img
$("#image").removeAttr("style");

//--- create the <a>, add the inline style
var anch = $("<a href='#'></a>");
$(anch).attr("style", imgStyle);

//--- add back to the img it's width and height
//--- the problem is here: imgWidth does not contain 'auto'
$("#image").css({"width" : imgWidth, "height" : imgHeight});

//--- wrap the img
$("#image").wrap(anch);

here's a fiddle with the code: http://jsfiddle/cBXAz/1/

any idea? How can I get the auto out of that inline style? I need to give width: auto to the image instead of a px value.

Thanks in advance, best regards

• javascript
• jquery
• css

• 1 $("#image").css({"width" : "auto"})??? – Morpheus Commented Jul 16, 2013 at 9:06
• When I look at the fiddle I don't see height:auto on the image. – Kevin Bowersox Commented Jul 16, 2013 at 9:07
• @KevinBowersox I wrote "width: auto", not "height" :) – BeNdErR Commented Jul 16, 2013 at 9:11
• @Morpheus I need to get that value from the inline style, I can't set it manyally.. – BeNdErR Commented Jul 16, 2013 at 9:12

1 Answer 1

document.getElementById('image').style.width;

Or for more jquery's way:

$("#image")[0].style.width;