天天看点

div滚动条

一般滚动条都是根据高度或者宽度来判断滚动

y滚动条

div滚动条

<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滚动

div滚动条

<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>  

x轴滚动条

表格水平滚动条滚动时怎样控制表头/操作不滚动,让数据滚动

思路:设置水平滚动条的宽度<该滚动表格的宽度。

2:设置表格的行的高度style="height:30"。注意只有表格的所有列宽(<td width="40px">)<该滚动表格的宽度时固定的高度才有效。否则失效。

div滚动条

<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>  

<?php } ?>   

</td>  

<td>  

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="list">  

<tr  class="tableheader" style="height:15">  

       <td width="100px">操作</td>  

      <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>  

<br>  

纵向

div滚动条

<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>