首页 新闻 会员 周边 捐助

使用jquery怎样动态的根据浏览器的窗口的大小改变网页中的DIV的宽度大小？

0
悬赏园豆：20 [已解决问题] 解决于 2012-06-15 15:22

比如

<div style="width=1024px;float:left;">

  <div style="width=600px"></div>

</div>

现在要把浏览器的窗口缩小，比如浏览器窗口的大小由1000px改变称为了800px，宽度减小了200px，怎样动态的把里面的宽度为600px的div宽度也减小200px呢？感谢大神们的回答！

JCWK的主页 JCWK | 初学一级 | 园豆：68
提问于：2012-04-23 09:58
< >
分享
最佳答案
-2

建议用百分比实现，如果一定要用固定值，要监听 window.onresize 事件

收获园豆：20
artwl | 专家六级 |园豆：16736 | 2012-04-23 10:18

我现在写脚本遇到的困难是怎样获得浏览器窗口大小改变前后，宽度的差。请问这个减小或者是增加的宽度差怎么获得呢？求脚本。谢谢您了！

JCWK | 园豆：68 (初学一级) | 2012-04-23 10:59
其他回答(4)
0

1.设置DIV的宽度全设置为100%；

2.将外面DIV的宽度设置为100%，用脚本动态获取外面DIV的宽度，赋值给里面DIV；（不知道能不能实现）

KivenRo | 园豆：1734 (小虾三级) | 2012-04-23 10:12
0

<div id="div1" style="width:expression(this.offsetParent.clientWidth - 200); background-color:Red"></div>
逻辑你自己改下就可以了

zernitta | 园豆：235 (菜鸟二级) | 2012-04-23 10:53
1 
$(function(){

var $wind = $(window);//将浏览器加入缓存中

var $do = $('#test');//将你要改变宽度的div元素加入缓存中

var win = $wind.outerWidth()//首先获取浏览器的宽度

$win.resize(function(){

//浏览器变化宽度的动作。

var newW = $wind.outerWidth();

$do.outerWidth(Math.abs(win-newW));

})

})

这样应该可以希望能回答你的问题

水御双氛 | 园豆：155 (初学一级) | 2012-04-24 06:21
0

这是页面布局的问题.

简单的方法：

左边的div

<div style="width;100px;position:absolute;left:0px;"></div>

右的div

<div style="width:100px;position:absolute;right:0px;"></div>

中间的div

<div style="margin-left:100px;margin-right:100px;"></div>

高度你按自己的要求设置。

积跬步 | 园豆：214 (菜鸟二级) | 2012-04-28 23:59
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。