在jsp中怎么固定div大小，当超出时出现滚动条

Posted 2023-05-05

这是我的代码：

<table width="70%" border="0" align="center">

<tr>
<td>
<FIELDSET style="width: 100%;">
<LEGEND>
关系配置
</LEGEND>
<DIV class="InfoArea" id="tabPane1" align="center">
<table align="center" height="250px" >

<tr>

</tr>
<tr>
<td nowrap>
业务环节：
</td>
<td>

<input type="hidden" name="linkOrderId" value="">
<img class="refButtonClass" onclick="open_window_link()" src="<%=request.getContextPath()%>/images/select_blue.gif"><input class="text_field_reference_readonly" type="text" name="linkName" value="" readonly="">

</td>
</tr>
<tr>
<td>
业务环节列表
</td>

</tr>
<div style="width:50px;height:50px;overflow:auto;">
<table >
<c:forEach var="pro" items="$list">
<c:if test="$not empty pro">
<tr class="nav">
<td align="center">
<input type="checkbox" name="linkId"
value="$pro.linkId" checked/>
</td>
<td align="center">
业务环节名称：
  
</td>
<td align="center">
  
$pro.linkName
  
</td>
<td align="center">
  

  
</td>
<td>
  
</td>
<td>
  
</td>

</tr>
</c:if>
</c:forEach>
</table>
</div>
</table>
<br />

</DIV>
</FIELDSET>
</td>
</tr>
</table>

我的代码格式本来挺规范的，但是一粘到这里边就乱了。不好意思
然后主要就是<div style="width:50px;height:50px;overflow:auto;">这段，不知道为什么我试了不管用

参考技术A 改成这样：

<table width="70%" border="0" align="center">
<tr>
<td><FIELDSET style="width: 100%;">
<LEGEND> 关系配置 </LEGEND>
<DIV class="InfoArea" id="tabPane1" align="center">
<table align="center" height="250px" >
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td nowrap> 业务环节： </td>
<td><input type="hidden" name="linkOrderId" value="">
<img class="refButtonClass" onclick="open_window_link()" src="<%=request.getContextPath()%>/images/select_blue.gif">
<input class="text_field_reference_readonly" type="text" name="linkName" value="" readonly=""></td>
</tr>
<tr>
<td> 业务环节列表 </td>
<td><div style="width:50px;height:50px;overflow-y:auto;overflow-x:hidden;">
<table >
<c:forEach var="pro" items="$list">
<c:if test="$not empty pro">
<tr class="nav">
<td align="center"><input type="checkbox" name="linkId"
value="$pro.linkId" checked/></td>
<td align="center"> 业务环节名称： </td>
<td align="center"> $pro.linkName </td>
<td align="center"></td>
<td></td>
<td></td>
</tr>
</c:if>
</c:forEach>
</table>
</div></td>
</tr>
</table>
<br />
</DIV>
</FIELDSET></td>
</tr>
</table>本回答被提问者采纳 参考技术B <div style="width:50px;height:50px;overflow:auto;">

改成
<div style="width:50px;height:50px;overflow:hidden;">
意思就是超出部分隐藏！

网页中如何让DIV在网页滚动到特定位置时出现

我的网页中有个DIV，但是我不想让他在页头出现，如何实现在滚动条滚动到特定位置时才出现？

用js或者jquery比较好实现。
但你要知道，滚动到哪个特定位置，例如滚动到一个标题h3那显示这个div，那么可以用jquery算这个h3距离网页顶部的距离：$("h3").offset().top，这个值有了后，还要算滚动条的距离$(this).scrollTop()。第一个值是不会吧的，主要是第二个值是不断在变，所以要写到滚动方法里：$(window).scroll()。
大概整个代码是
$(function()
var h3_height = $("h3").offset().top;

$(window).scroll(function()
var this_scrollTop = $(this).scrollTop();
if(this_scrollTop>h3_height )
$("div").show();

);
);

最终代码不一定是我这样，但希望你了解整个的思路。 参考技术A 用js或者jquery比较好实现。
但你要知道，滚动到哪个特定位置，例如滚动到一个标题h3那显示这个div，那么可以用jquery算这个h3距离网页顶部的距离：$("h3").offset().top，这个值有了后，还要算滚动条的距离$(this).scrollTop()。第一个值是不会吧的，主要是第二个值是不断在变，所以要写到滚动方法里：$(window).scroll()。
大概整个代码是
$(function()
var h3_height = $("h3").offset().top;

$(window).scroll(function()
var this_scrollTop = $(this).scrollTop();
if(this_scrollTop>h3_height )
$("div").show();

);
);