visibility与内容hover的延时显示

HTML

<table>
    <tr>
        <td>栏目1</td>
        <td>栏目2</td>
        <td><a href>操作▾</a>
            <div class="list"> <a href>编辑</a> <a href>删除</a> </div></td>
    </tr>
    <tr>
        <td>栏目1</td>
        <td>栏目2</td>
        <td><a href>操作▾</a>
            <div class="list"> <a href>编辑</a> <a href>删除</a> </div></td>
    </tr>
</table>
					    

CSS

td a { display: block; }
.list {
    width: 80px;
    position: absolute;
    visibility: hidden;
    border: 1px solid #ccc;
    background: #fff;
}
td:hover .list {
    visibility: visible;
    transition: visibility 0s .2s;
}
.list a {
    padding: 5px 10px;
    color: #333;
}
.list a:hover { background-color: #f5f5f5; }
					    

JS

//no