javascript - 展开右侧 float 的 div 以插入左侧的 div

标签 javascript jquery css html

所以,我有一个

<div style="width:250px;border: 1px solid;overflow:auto" id="container">
    <div style="float:left;">Vasileostrovsky rayon</div>
    <div id="rightAlignedDiv"> Div which will be expanding </div>
</div>

如何使 #rightAlignedDiv 扩展到左侧。换句话说,当 #rightAlignedDiv 足够宽时,我希望它把左边的推得更小,只有左边的 div 可以移动到新的一行:)。

这是演示困境的 fiddle http://jsfiddle.net/eC9ZX/1/

这必须使用 css 以某种方式解决。 JS 解决方案会使逻辑过于复杂。而且它不会是一个优雅的。

最佳答案

window.alterWidth = function() {
    var testWidth=parseInt(document.getElementById("testId").style.width);
    var testWidth1=parseInt(document.getElementById("rightDiv").style.width);

     document.getElementById("testId").style.width = (testWidth-33)+'px';
    document.getElementById("rightDiv").style.width = (testWidth1+33)+'px';
    var newImg = $('#com_ibm_ioc_spb_kpi_StatusBox_412').clone();

    $('#rightDiv').append(newImg);


}

为两个 div 提供 id 并使第一个 div 自动溢出。

也试试这个 fiddle http://jsfiddle.net/L774V/

关于javascript - 展开右侧 float 的 div 以插入左侧的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24425326/

相关文章:

html - 当我将导航栏位置更改为固定时,它会改变屏幕的两侧并收缩

javascript - 有没有办法在右键单击时在任何元素中添加 "paste"选项

php - Jquery 提交单选按钮无需重新加载和

javascript - Jquery 自动完成渲染未定义项目

jquery - 在文本后显示所需的星号?

css - 在右侧显示省略号并将文本右对齐

html - 响应式——所有元素在移动设备上都太小了

javascript - 错误 - 权限被拒绝 - jQuery 打印预览?

javascript - [Vue 警告] : Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders

javascript - 点击带有数据集的按钮,会出现具有相同数据集的div