一般滚动条都是根据高度或者宽度来判断滚动
Y滚动条
Java代码
- <div id="wrap" style="width:1076px; height:460px; overflow-y:scroll;">
- <table class="tableborder" width="100%" style="float:left">
- </div>
根据数据条数的div滚动条
1.如果表格记录小于14，就不滚动，此时不用div就没有长宽的固定限制。
2.如果大于14就滚动，用div滚动
Java代码
- <div style="overflow:auto; height:400px; border-bottom:1px solid #999999">
- <table border="0" width="100%" cellspacing="0" cellpadding="0" class="list" id="tab1">
- <tr class="tableheader">
- <td width="100"></td>
- </tr>
- </table>
- </div>
X轴滚动条
表格水平滚动条滚动时怎样控制表头/操作不滚动，让数据滚动
思路：设置水平滚动条的宽度<该滚动表格的宽度。
2:设置表格的行的高度style="height:30"。注意只有表格的所有列宽（<td width="40px">）<该滚动表格的宽度时固定的高度才有效。否则失效。
Java代码
- <table width="100%" border="0" cellspacing="0" cellpadding="0">
- <tr><td>
- <div STYLE='position:relative;overflow:scroll; width:600;overflow-y:hidden'>
- <table width='850' border="0" cellspacing="0" cellpadding="0" class="list">
- <tr class="tableheader" style="height:15">
- <td width="40px">序号</td>
- <td width="90px"">申请时间</td>
- <td width="120px">申请公司</td>
- <td width="70px">联系人</td>
- <td width="100px">服务名称</b></td>
- <td width="90px">关务港口</td>
- <td width="100px">客户名称</td>
- <td width="100px">客户编码</td>
- </tr>
- <?php
- $tpl_comm_array=$form->commission_array;
- foreach($tpl_comm_array as $key => $value){
- ?>
- <tr class="listcontent" onmouseover="this.bgColor='#EFF4FC'" onmouseout="this.bgColor='#ffffff'" style="height:30">
- <td><b><?php echo $tpl_comm_array[$key]['id']; ?></b></td>
- <td><?php echo $tpl_comm_array[$key]['commdate']; ?></td>
- <td><?php echo $tpl_comm_array[$key]['copname']; ?></td>
- <td><?php echo $tpl_comm_array[$key]['contact']; ?></td>
- <td><?php echo $tpl_comm_array[$key]['servname']; ?></td>
- <td><?php echo $tpl_comm_array[$key]['portname']; ?></td>
- <td><?php echo $tpl_comm_array[$key]['custname']; ?></td>
- <td><?php echo $tpl_comm_array[$key]['custcode']; ?></td>
- </tr>
- <?php } ?>
- </table>
- </div>
- </td>
- <td>
- <table width="100%" border="0" cellspacing="0" cellpadding="0" class="list">
- <tr class="tableheader" style="height:15">
- <td width="100px">操作</td>
- </tr>
- <?php
- $tpl_comm_array=$form->commission_array;
- foreach($tpl_comm_array as $key => $value){
- ?>
- <tr class="listcontent" onmouseover="this.bgColor='#EFF4FC'" onmouseout="this.bgColor='#ffffff'" style="height:30">
- <td align="center"><span class="ysmbotton"><a href="/Main.php?do=AdminOrder&submit=Update&order_application=<?php echo $tpl_comm_array[$key]['commid']; ?>">
- 签约订单</a></span></td><td style="padding-right:10px;">
- <span class="bluesmbotton">
- <a href="/Main.php?do=OrderDisplay&order_application=<?php echo $tpl_comm_array[$key]['commid']; ?>" target="_blank">
- 查看详情</a></span></td>
- </tr>
- <?php } ?>
- </table>
- <br>
- <td>
- </tr>
- </table>
纵向
Java代码
- <div style="overflow:auto; height:400px; border-bottom:1px solid #999999;">
- <div style="width:260px;height:120px; overflow-y:scroll; border:1px solid;">
<div style="width:798px;overflow:scroll;"> 横向
<div style="width:260px;height:120px; overflow:scroll; border:1px solid;">双向
让竖条消失:
<BODY STYLE='OVERFLOW:SCROLL;OVERFLOW-Y:HIDDEN'></BODY>
让横条消失:
<BODY STYLE='OVERFLOW:SCROLL;OVERFLOW-X:HIDDEN'></BODY>
