#5388 closed bug
.width() doesn't work properly in Google Chrome
Reported by: | michal | Owned by: | michal |
---|---|---|---|
Priority: | low | Milestone: | 1.5 |
Component: | dimensions | Version: | 1.3.2 |
Keywords: | width chrome | Cc: | |
Blocked by: | Blocking: |
Description
Browser: Google Chrome 3.0.195.21 ================== Code: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script> $(document).ready(function() {
$('td').each(function() {
$(this).width(); when this line is commented - everything seems to be okay on google chrome $(this).css('width','100px');
});
}); </script> <style> th,td {width: 100px; background: yellow;} .hidden {display: none;} </style> <table> <thead><tr><th>1</th><th class="hidden">2</th><th>3</th></thead> <tbody><tr><td>4</td><td class="hidden">5</td><td>6</td></tbody> <tfoot><tr><td>7</td><td class="hidden">8</td><td>9</td></tfoot> </table>
============== When $(this).width() is executed then width for selected cell is set, even if it should return only a value of this width. [file 1.jpg]
I don't know if it's also a bug in Google Chrome, but when I try to set width with $(this).css('width','100px') I don't have this problem.
When I comment $(this).width() everything is fine [file 2.jpg]
Attachments (3)
Change History (9)
Changed 13 years ago by
Changed 13 years ago by
Attachment: | hiddenheader.html added |
---|
comment:1 Changed 13 years ago by
Component: | unfiled → dimensions |
---|
comment:2 Changed 12 years ago by
I've run into this in the past; I believe the problem is more specifically related to the visibility of the table cell in question. The requirements seem to be: Google Chrome browser, in the context of a loop, working with TD or TH elements (table cells), one more more of said table cells is hidden from view (style="display:none;"). This causes some sort of assignment to occur; invisible but space-filling elements seem to be inserted into the DOM.
The only workaround for this issue of which I am aware is to find out whether or not the table cell in question is visible prior to calling its .width() function.
Hope this helps.
comment:3 Changed 12 years ago by
Keywords: | google removed |
---|---|
Milestone: | 1.4 → 1.5 |
Priority: | major → low |
Status: | new → open |
Could you provide a live test case for this in a jsfiddle, we would greatly appreciate it.
Thanks!
comment:4 Changed 12 years ago by
Owner: | set to michal |
---|---|
Status: | open → pending |
comment:5 Changed 12 years ago by
Status: | pending → closed |
---|
Automatically closed due to 14 days of inactivity.
comment:6 Changed 11 years ago by
Please re-open this ticket. I have created a JSfiddle example for it here:
http://jsfiddle.net/rw123948/KGxbk/
The sample alerts the widths of several <col> elements. I have tested and it does work when you use <td> elements, but if you compare with Firefox, which does read the widths of <col> elements, you can see that there is a Chrome specific bug that causes the script to return 0 instead of the actual width.
width() is executed