2

I'm trying to get a css property that was dynamically set with jquery.

Consider this code :

$(document).ready(function(){

$("#clickme").click(function(){

    $("#myTable").css('borderStyle','solid');
    $("#myTable").css('borderColor','black');
    $("#myTable").css('borderWidth','3px');
});

$("#clickme2").click(function(){
    alert($("#myTable").css('borderWidth'));
});

});

Clicking on clickme button will set the table myTable with the expected properties (3px solid black), but then clicking on clickme2 won't get the 3px value ! Do you know any fix ?

I read here Can jQuery get all CSS styles associated with an element?

that a solution could be using the .style of the DOM element, but if jquery could do it, I would prefer the jquery way ...

(the wysiwig for stackoverflow is a very good idea ;))

Community
  • 1
  • 1
ling
  • 21
  • 1
  • 2
  • Note that your code can be improved/simplified as `$('#myTable').css({ borderStyle:'solid', borderColor:'black', borderWidth:'3px' });` – Phrogz Jan 07 '11 at 21:17
  • What happens when you click on clickme2? – Jake Jan 07 '11 at 21:28

2 Answers2

2

My understanding is when you set a value with "borderWidth," it's a shorthand way of setting "borderTopWidth," "borderRightWidth," "borderBottomWidth," and "borderLeftWidth" all at once.

Therefore, I think you have to specify which side of the border you want to get, such as "borderBottomWidth."

Jake
  • 4,829
  • 2
  • 33
  • 44
0

There is no actual value borderWidth or border-width it is a CSS shorthand property to set the four underlying properties border-top-width, border-right-width etc.

Thus you can only query for one of those four values:

DEMO: http://jsfiddle.net/marcuswhybrow/zu74F/

Marcus Whybrow
  • 19,578
  • 9
  • 70
  • 90
  • ok, thanx,then for the border width I found alert($("#myTable").get(0).style.borderWidth); useful – ling Jan 07 '11 at 21:28