javascript - 超过父级宽度的元素的特定规则

标签 javascript css dom

当子元素的宽度高于父元素时,它会超过父元素的宽度。 我想 相反,它超过了父级的宽度,它使 right 设置为“0”,使其粘在父级 Div 的右侧,这可能吗?

参见示例:http://jsfiddle.net/rTg3x/3/ inner1 div 超出了 main div 限制,而 inner2 div 没有,我想让 inner1 div 粘在右边,没有知道它拥有的 left CSS 数量。

这可能吗? 非常感谢。

最佳答案

您可以尝试一些讨厌的 jQuery。这是我想出的。它有效,但可能有更简洁的方法。

if(($('#inner1').offset().left + $('#inner1').width()) > $('#main').width()){
    $('#inner1').css({'right':'0', 'left': 'auto'});
}

基本上就是说,如果您的 div 的宽度加上它与左侧的偏移量大于父级的宽度,则将其右对齐。

对你来说更通用。

$('#main').find('div').each(function() {
    if($(this).offset().left + $(this).width() > $('#main').width()) 
        $(this).css({'right':'0', 'left': 'auto'});

});

关于javascript - 超过父级宽度的元素的特定规则,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11546695/

相关文章:

php - CSS 颜色在 HTML 电子邮件中丢失

html - margin 自动不起作用

html - "..."在css中是什么意思

Javascript:我的索引顺序有问题

javascript - 我如何在 Ember 1.13 中绑定(bind)多个类名?

javascript - 使用windows超时功能时如何加载HTML文件?

javascript - 是否可以缓存/存档整个 Web 文档(包括 DOM 的精确状态)并稍后重新加载?

javascript - 如何控制按钮单击时的动画功能?

javascript - 如何使用javascript更改子元素的字体大小

node.js - 使用 cheerio 选择具有属性的元素