原因:因为表格左侧固定列,并且列宽大于了滚动条的横向宽度,导致将横向滚动条,遮盖住了。解决方式:对应表格的滚动条,设置min-width,需要大于固定列的宽度,注意:滚动条是表格哪一级的class出现的,需要对应写这一级容器的滚动条样式。
<body><script>
function show() {
document.getElementById("aaaa").style.display = "block"
}
function hide(){
document.getElementById("aaaa").style.display = "none"
}
</script>
<div style="width:180px">
<div style="float:left">
<button onclick="show()" >显示</button>
<button onclick="hide()" style="float:right">关闭</button>
</div>
<br>
<div id="aaaa" style="height:100pxwidth:180pxfloat:leftoverflow-y:scrolloverflow-x:hidden">
<table border="1" style="border-collapse:collapse" >
<tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td> <tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td> <tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td> <tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td> <tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td> <tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td> <tr><td>c </td>
<td>d</td>
<td>3</td>
<td>3</td>
<td>3</td><td>3</td><td>3</td><td>3</td>
</tr>
</table>
</div>
</div>
</body>
改成:
var top=parseInt(hotListDiv.style.top)if (top <=-700) {
hotListDiv.style.top = "0px"
}
else {
hotListDiv.style.top = (top-70)+"px"
}