高度-宽度关系,同一div、不同div高度与宽度关系控制函数
//对象1的高度等于对象2的高度n倍,调用方法:Ht1DivideHt2('#div2','#div1',3)//div2的高度是div1高度的3倍
function Ht1DivideHt2(obj1,obj2,n){
var oHeight= $(obj2).height()*n;
$(obj1).css("height", oHeight);
}
//对象1的宽度等于对象2的宽度n倍,调用方法:Wd1DivideWd2('#div2','#div1',3)//div2的宽度是div1宽度的3倍
function Wd1DivideWd2(obj1,obj2,n){
var oWidth= $(obj2).width()*n;
$(obj1).css("width", oWidth);
}
//对象的高度等于宽度的n倍,调用方法:HtDivideWh('#div1',2)//div1的高度是其宽度的2倍
function HtDivideWh(obj,n){
$(obj).css("height",function(){
var oWidth= $(this).width()*n;
$(this).height(oWidth);
});
}
高度-宽度关系,同一div、不同div高度与宽度关系控制函数的更多相关文章
- css实现div中图片高度自适应并与父级div宽度一致
需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...
- div中iframe高度自适应问题
网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...
- (转载)html中div使用自动高度
为什么要使用div标签 1.更多的配置项,那就意味着更灵活,当然,难度也更高: 2.可以方便的容纳其他html标签: static定位就是不定位,出现在哪里就显示在哪里,这是默认取值,只有在你 ...
- 关于div容器在ie6下默认高度不为0(存在默认高度)
最近做项目的时候遇到一个问题,相信很多人都遇到过,就是在测试兼容性的时候,在ie6下小于12px 的背景的高度不等于原高,或许这样说你可能不是很明白,那就举个例子吧! 如图所示: 锯齿状的背景图本来是 ...
- div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)
原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...
- Chrome&FF&Opera&下DIV不设置高度显示背景颜色和边框的办法
今天在排版的时候,外层的div不写高度的话背景颜色和边框没法办法显示,但是在IE下面就可以,这个有三个解决办法. 第一: 直接给最外层的div设置高度(不推荐). 第二: 在内部每个div后添加一个清 ...
- div有最小高度且自适应高度
DIV最小高度且自适应高度 在IE6中,如果子容器的高度超过父容器的时候,父容器会被子容器撑开,所以我们可以直接设置一个height的高度值即可.但是在IE7和firefox就不行了,它不会自动撑 ...
- H5新增属性contenteditable(不用JS,实现div模拟textarea高度自增长)
无意中看到一篇博客介绍了contenteditable这个属性——不需用JS,只需在div里加上contenteditable="true",即可实现div模拟textrarea( ...
- div不设置高度背景颜色或外边框不能显示的解决方法
在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度,在浏览时出现最外层Div的背景颜色和边框不起作用的问题. 大体结构<div class="oute ...
- div控制最小高度又自适高度
div控制最小高度又自适高度我们在用div布局的时候经常会遇到这样的一种情况:我们需要设置一个div的高度,当里面的东西超过这个高度时,让这个容器自动被撑开,也就是自适应高度.当里面的信息很少时候,我 ...
随机推荐
- nyoj 63 小猴子下落 思维
nyoj 63 小猴子下落 题目链接: http://acm.nyist.net/JudgeOnline/problem.php?pid=63 思路: 不需要用指针创建二叉树,也不需要用数组来模拟二叉 ...
- 基于‘BOSS直聘的招聘信息’分析企业到底需要什么样的PHP程序员
原文地址:http://www.jtahstu.com/blog/scrapy_zhipin_php.html 基于'BOSS直聘的招聘信息'分析企业到底需要什么样的PHP程序员 标签(空格分隔): ...
- eclipse导入新项目后,运行时找不到主类解决办法
最近在学习多线程,今天下了一套源码,导入到eclipse里后,随便找了个带main()的类试了一下,找不到主类. 首先想到的解决办法是把工程clean一下,并没有用.去网上找了一个遍终于找到了管用的方 ...
- 小白的Python之路 day1 Python3的bytes/str之别
原文:The bytes/str dichotomy in Python 3 Python 3最重要的新特性大概要算是对文本和二进制数据作了更为清晰的区分.文本总是Unicode,由str类型表示,二 ...
- Linux基础学习笔记以及常用命令
1.windows自带命令进入mysql所在磁盘 2.进入mysql安装目录的bin文件 D:\>cd D:\Program Files (x86)\mysql-5.5.25-winx64\ ...
- 再说Postgres中的高速缓存(cache)
表的模式信息存放在系统表中,因此要访问表,就需要首先在系统表中取得表的模式信息.对于一个PostgreSQL系统来说,对于系统表和普通表模式的访问是非常频繁的.为了提高这些访问的效率,PostgreS ...
- 对datatable进行简单的操作
筛选出datatable中c_level=1的数据 dataRow[] rows = dt.Select("c_level=0"); 克隆表dt的结构到表dt,并将dt的数据复制到 ...
- dubbo源码—SPI
Java中的SPI SPI,Service Provider Interface,java中提供的一种使程序可扩展的方式,系统定义好接口规范,供其他服务提供方实现,服务提供方将自己jar包META-I ...
- ajax初探--实现简单实时验证
学习技术最好的方式就是在做中学,做一个小demo来对前端输入进行实时验证. 利用ajax技术和Sevlet技术来实现,使用原生的js. 源码可访问,我的Github 什么是ajax Ajax 即&qu ...
- webpack+babel+transform-runtime, IE下提示Promise未定义?
知识要求 babel的基础知识(推荐阮一峰的babel入门教程) 充分理解babel-plugin-transform-runtime与babel-runtime的作用(推荐github项目首页) w ...