##########如何让div随window.resize改变大小############

nik_Amis 2004-03-19 11:05:21
我用div给table做了阴影的效果，但是发现window在resize之后，div大小不变
请问如何能使div 在window resize之后符合table的大小？？


<html>
<head>
<script language="javascript">
//<!--
var MENU_SHADOW_COLOR='#555555';
var global = window.document;
global.fo_currentMenu = null;
global.fo_shadows = new Array;
function MakeRectangularDropShadow2(el, color, size)
{
var i;
var e=el;
var l=e.offsetLeft;
var t=e.offsetTop;
while(e=e.offsetParent)
{
l+=e.offsetLeft;
t+=e.offsetTop;
}
for (i=size; i>0; i--)
{
var rect = document.createElement('div');
var rs = rect.style;
rs.position = 'absolute';
rs.left = (l + i) + 'px';
rs.top = (t + i) + 'px';
rs.width = el.offsetWidth + 'px';
rs.height = el.offsetHeight + 'px';
rs.zIndex = el.style.zIndex - i;
rs.backgroundColor = color;
var opacity = 1 - i / (i + 1);
rs.filter = 'alpha(opacity=' + (100 * opacity) + ')';
el.insertAdjacentElement('afterEnd', rect);
global.fo_shadows[global.fo_shadows.length] = rect;
rect.name=el.name+i;
}
}
//-->
</script>

</head>
<body leftmargin="2" topmargin="2" rightmargin="2" bottommargin="2" bgcolor="#efefff">
<table width="100%" height="40" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<table width="98%" height="100%" id="tblHeadLine" name="tblHeadLine" align="center" bgcolor="#aaaaff" cellpadding="3" cellspacing="1" border="0" >
<tr bgcolor="#cfdfff" align="center">
<td align="left" valign="middle"><font color="#3333ee"> </font></td>
</tr>
</table>
</td>
</tr>
</table>


<script language="javascript">
//<!--
MakeRectangularDropShadow2(tblHeadLine,"#888888",4);
//-->
</script>
...全文
1336 9 打赏 收藏 转发到动态 举报
写回复
用AI写文章
9 条回复
切换为时间正序
请发表友善的回复…
发表回复
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
可是我有三个table

还有div的位置也不对

meizz辛苦在帮俺看看，谢谢
meizz 2004-03-19
  • 打赏
  • 举报
 回复
<script language="javascript"><!--
MakeRectangularDropShadow2(tblHeadLine,"#888888",4); //就加了以下一段代码
window.onresize = function(){mm("tblHeadLine");}
function mm(str)
{
var div = document.getElementsByTagName("DIV");
for(var i=0; i<div.length; i++)
{
if(new RegExp("^"+ str +"\\d+").test(div[i].name))
div[i].style.width = document.all[str].clientWidth;
}
}
//-->
</script>
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
没有人知道么
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
让div自动随着resize事件改变大小，符合table的大小
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
知道了，谢谢

稍候结账
:)
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
if(new RegExp("^"+ str +"\\d+").test(div[i].name))

还有这句话什么意思？
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
能不能给个完整的，我这边不知道那里写错了，连我一开始达到的效果都没有了

:S

yypp001 2004-03-19
  • 打赏
  • 举报
 回复
我试了一下你们的程序，都挺好使
试试设置div的id，把
var div = document.getElementsByTagName("DIV");
换成，用id取得
var div = document.getElementsById("**id");
nik_Amis 2004-03-19
  • 打赏
  • 举报
 回复
老大再指点指点，div的位置，大小还是搞不定啊
echarts 随屏幕大小改变大小chart.resize()
在同一页面中存在多个图表，chart.resize();其中之一不起作用。 Echarts同一页面多个图表自适应浏览器窗口大小——window.onresize 当前做的一个项目中，频繁使用到百度团队的Echarts，发在一个页面同时出现多个图表时，只有最后一个图表触发了window.onresize事件，查询官方文档后得到解决。 方法如下：
在 vue 中使用 window.onresize及div的resize事件
项目场景： 如何在 vue 中使用 window.onresize 如何避免 覆盖其它的 window.onresize echarts 监听图表容器的大小并改变图表大小 解决方案： <script> /* echarts 监听图表容器的大小并改变图表大小 */ export default { mounted() { this.myChart = this.$echarts.init(this.$refs.canvas) // 监听 window.onresize
动态获取div的高度 随着窗口变化而变化 window.resize
autodivheight(); function autodivheight(){ //函数：获取尺寸 //获取浏览器窗口高度 var winHeight=0; if (window.innerHeight){ winHeight = window.innerHeight; } else if ((document.body) && (document.body.clientH
（转）jquery 监听div大小变化函数|div resize事件
https://blog.csdn.net/mengzhengjie/article/details/72829828  （原文链接）   窗口有大小改变的监听事件，却不适用于div window.onresize = function(){}   如下 是监听div大小变化的jquery扩展，通过这个函数扩展jquery，使div也具有和窗口一样的resize功能 //监听div大...
div随着浏览器窗口大小变更，改变大小（resize）
浏览器的放大缩小会导致网页布局变动，jquery的resize()方法，可以根据浏览器的窗口大小的变动，对网页进行操作：以下是div随着浏览器窗口大小变更，改变大小（resize）的案例：html:js效果：resizeDiv的块会根据网页变更，大小也随之改变...
JavaScript

87,910

社区成员

224,616

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章