HTML:
<div class="table" >
<div class="row" >
<span>Tb with DIV</span> <span>col2</span> <span>col3</span>
</div>
<div class="row" >
<span>col1</span> <span>col2 test</span> <span>col3</span>
</div>
<div class="row" > <span>col1</span> <span>col2</span> <span>col3 test</span>
</div>
</div>
<table>
<tr id="testRow">
<td>Tb with <'table'></td> <td>col2</td> <td>col3</td>
</tr>
<tr >
<td>col1</td> <td>col2 test</td> <td>col3</td>
</tr>
<tr >
<td>col1</td> <td>col2</td> <td>col3 test</td>
</tr>
</table>
CSS:
.table, table {
display:table;
/*
width:200px;
height:100px;
zoom:1;
*/
}
.row { display:table-row; }
.row, tr {
width:200px !important;
min-height:1px !important;
zoom:1;
white-space:nowrap;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
filter: alpha(opacity=20);
-moz-opacity:0.2;
-khtml-opacity: 0.2;
opacity: 0.2;
}
.row span, td {display:table-cell;padding: 5px;}
Javascript
$(function () {
console.log (document.getElementById('testRow2').currentStyle.hasLayout);
//$('.row, tr').fadeTo('fast',0.2);
});
因为不透明度不起作用,我应该在控制台中得到“假”(对于 IE7 和 8),但结果是“真”
元素是否真的“hasLayout”但不透明度由于其他原因不起作用?
虽然我对此表示怀疑,因为即使是 jQuery 也无法设置不透明度。