使用JQUERY进行后台页面布局控制DIV实现左右式
时间：2020-10-24 11:57:39|栏目：jquery|点击： 次
一个网站的后台管理都有一部分是保持固定位置不动，可编辑部分是随浏览器变化而变化的，因此有的时候使用frame框架来实现这种形式，这边作者不是使用的frame而是纯div进行布局，想要实现这种方式需要怎么做呢，下面就控制DIV实现左右式，左边固定，右边随浏览器变化而变化的JQUERY实现代码。
<script type="text/javascript">
//根据浏览器大小调整左右布局的大小
$(window).ready(function(){
var wheight=$(window).height();
var wwidth=$(window).width();
$(".div_admin_left").css("height",(wheight-40));
$(".div_admin_right").css("height",(wheight-40));
$(".div_admin_right").css("width",(wwidth-285)+'px');
});
$(window).resize(function(){
var wheight=$(window).height();
var wwidth=$(window).width();
$(".div_admin_left").css("height",(wheight-40));
$(".div_admin_right").css("height",(wheight-40));
$(".div_admin_right").css("width",(wwidth-285)+'px');
});
</script>
此处作者进行了左边固定，右边随浏览器变化而变化的方式，同时还实现了随浏览器的变大而变大，缩小也相对应成比例缩小的代码，仅供参考。
复制代码 代码如下:
<script type="text/javascript">
//根据浏览器大小调整左右布局的大小
$(window).ready(function(){
var wheight=$(window).height();
var wwidth=$(window).width();
$(".div_admin_left").css("height",(wheight-40));
$(".div_admin_right").css("height",(wheight-40));
$(".div_admin_right").css("width",(wwidth-285)+'px');
});
$(window).resize(function(){
var wheight=$(window).height();
var wwidth=$(window).width();
$(".div_admin_left").css("height",(wheight-40));
$(".div_admin_right").css("height",(wheight-40));
$(".div_admin_right").css("width",(wwidth-285)+'px');
});
</script>
此处作者进行了左边固定，右边随浏览器变化而变化的方式，同时还实现了随浏览器的变大而变大，缩小也相对应成比例缩小的代码，仅供参考。
上一篇：基于jQuery实现的百度导航li拖放排列效果，即时更新数据库
栏 目：jquery
本文标题：使用JQUERY进行后台页面布局控制DIV实现左右式
本文地址：http://www.codeinn.net/misctech/15376.html
