javascript 两个DIY一样的宽度。 20C

用javascript 如何实现 当 "aa"的宽度发生变化时,“bb”的宽度也随之变化成一样的宽度。

 <div class="aa"></div>
 <div class="bb"></div>

0

2个回答

aa,bb样式怎么写的,inline-block?

aa内容改变导致的宽度改变还是什么?最好是在更改aa内容改变后或者aa宽度(aa.offsetWidth)设置bb的宽度(bb.style.width=aa.offsetWidth+'xp')

如果你无法修改逻辑,就用计时器定时执行上面的设置bb宽度代码就行


<style>.aa,.bb{background:#eee;margin-left:10px;display:inline-block}</style>
<div class="aa">aaa</div>
<div class="bb">bbb</div>
<script>
    var aa = document.querySelector('.aa'), bb = document.querySelector('.bb');
    setInterval(function () { bb.style.width = aa.offsetWidth + 'px' }, 100)

    setInterval(function () {aa.innerHTML+='a' }, 1000);
</script>

0
showbo
showbo 回复qq_34571911: div原本就占用一行,所以和你的aa样式有关。如果没设置过就是直接浏览器宽度,你应该是想设置高度吧,这样内容不一样高度才会不一样。直接执行第一个setInterval里面的语句就行了,。 window.onload=function(){var aa = document.querySelector('.aa'), bb = document.querySelector('.bb');bb.style.width = aa.offsetWidth + 'px' ;bb.style.height= aa.offsetHeight + 'px' }
2 个月之前 回复
qq_34571911
qq_34571911 你好,我的意思是 假如div class="aaa" 里面有很多文字的话,这个div 宽度就会增大, 那么虽然div class="bbb"就算没有文字,也会随着aaa变宽而变宽。
2 个月之前 回复
caozhy
caozhy 正确,✔
2 个月之前 回复

如果要实现一个div宽度边框,另一个div也进行调整:那必须有个线程不停检测div1
的宽度是否发生变化:
如: var dw1 = 100;//div1的初始宽度
setInterval(function() {
if(div1.width != dw1) {//伪代码
dw1 = div1.width;
dw2.resize(dw1);
}
});

0
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
如何使两个表格的列宽一致?
    a     b     c                 这里是你的文字     你看看     会不会自动适应呀?                 var   da   =   document.all;     da.t1.style.width=da.t2.clientWidth;     da.td1.style.width=da.d1.clientWidth;    
JS中控制两个div的高度保持一致
<script type="text/javascript"> $(function(){ if($("#left").height() > $("#right").height()){ $("#right").css("height",$("#left").height()); }else{ $("#left").css("height",$("#right").height()); } }) <
空格长度与一般文字宽度不同的对齐方法
写页面时写登陆版块,一行写用户名:+输入框,下一行写密码:+输入框。想密码两字中间空一格来对齐。空格的长度比一般文字短,空一个没对齐,空两格在firefox对齐了可是在IE还是没对齐,空三格的话IE是对齐了,可是FF就对不齐了。我只能用其他方法。“密”和“码:”分别用两个span标签,然后再用CSS设置span标签为块级元素display:block;设置浮动float:left还有两个字之间的距
CSS让表格宽度适应内容
th,td{white-space : nowrap}
两个字符串看起来是一样的,但是字符串的长度显示不同 -- java
一. 问题 今天发现,程序中,比较两个字符串是否相等的部分, 出现了, 两个字符串看起来相同, 但是比较结果确实不同的情况。 二. 具体情况 1. 字符串的内容是通过读取文件来得到的。 2. 比较的两个字符串来自两个不同文件。 3. 后来发现, 一个文件的编码是utf8+bom,一个是utf8。 三. 解决方案 将utf8+bom的编码格式改为utf8。问题解决。 只要将两个文件的...
DIY 首页可视化编辑
DIY初始化(diy.init.js): $(function () { //添加一个模块 $(".j-diy-addModule").click(function () { var type = $(this).data("type"); //获取模块类型 var strUrl = window.location.toLocaleString()
动态改变表格列宽 js实现
很实用的动态改变表格列宽,就像Excel一样,可以自由伸缩
自定义高度与宽度都相等的RelativeLayout
自定义高度与宽度都相等的RelativeLayout。 GridView的item是正方形,而android需要适配不同尺寸的手机,所以不能写死item的高度和宽度。因为GridView是可以根据numColumns来分配item的宽度的,所以我们把item布局的高度设为与宽度一样就能实现适配了。
当宽度为百分比时,如何让高度和宽度一样
当宽度为百分比时,如何让高度和宽度大小一样呢?.content li:before { content:""; display: inline-block; padding-bottom: 100%; }
元素自适应宽度、换行
通过设置百分比和最小宽度来实现,放大可以均匀排列,缩小可以自动换行 #kpi_tb input{ width: 100px; } #kpi_tb .row{ margin:0px; padding:0px; width: 100%; text-align:center; display: inline-block; position: relative; } #kp

相似问题

1
javascript怎么实现对多个html+div实现的css的界面先判断后显示?
1
javascript语言中怎么实现箭头方式的用户的界面,不要再回答箭头函数了!
2
javascript 两个DIY一样的宽度。
4
javascript语言怎么实现一个文本框从一个页面导入到另一个页面?
2
javascript怎么实现箭头的界面,不是实现箭头函数,而是桃宝那种状态箭头?
4
初学javascript 循环语句的写法。
4
如何利用javascript语言的ajax功能实现从后台调用前台的变量并且做出判断?
2
怎么javascript实现访问的网站自动添加到主页和收藏夹的功能不需要提示用户
3
javascript语言怎么能够对后台的数组型(非字符串)实现split一样的功能?
3
怎么利用javascript语言实现调用后台的一个语句里的一个变量并且显示的功能?
2
javascript怎么实现调用api的功能,api调用功能的语句的格式是怎么样的?
1
javascript怎么实现判断用户的计算机是否已经处于开机的状态了呢?如何判断状态?
2
请问怎么利用javascript实现电子计算机远程开机和关机的功能?定时开机怎么实现?
2
javascript 点击改变 class 名
3
javascript 点击改变 class 名
1
javascript多维数据数组的转换是怎么进行循环和判断的,怎么直接判断转换以后的字符串?
1
javascript怎么实现对onekey ghos的调用。而且需要制定分区的参数,怎么设置?
1
javascript语言怎么实现通过gho文件的下载、更换操作系统
11
javascript 当数字为空的时候 标签样式为display:none
2
简单javascript的问题请教,怎么利用javascrip这个工具实现表达式求值运算?