我需要使用CSS和jQuery在不改变其位置或tds宽度的情况下使输入字段溢出

我需要在焦点上放大输入字段而不包含td放大.

此外,在两个领域都应保持其实际位置(看看小提琴,它是mooves)而不是向上或向下移动(由绝对位置引起的).

这是我的实际状态

$('.Bemerkung').focus(function() {
    $(this).attr('size','30');
    $(this).parent().css({'position':'absolute'});
    $(this).css({'position':'absolute'});
})
$('.Bemerkung').blur(function() {
    $(this).attr('size','5');
    $(this).removeAttr('style');
    $(this).parent().removeAttr('style');
})

http://jsfiddle.net/kazuya88/dhy0dxyy/

希望您能够帮助我.

解决方法

它与你原来的不太相符：

$('.Bemerkung').focus(function() {
    oldWidth = $(this).width();
    $(this).attr('size','30');
    $(this).css({'position':'relative'});
    $(this).css({'margin-right':('-'+($(this).width()-oldWidth)+'px')});
})
$('.Bemerkung').blur(function() {
    $(this).attr('size','5');
    $(this).removeAttr('style');
    $(this).parent().removeAttr('style');
})

更新：我想我应该在这里添加更多解释.这基本上在获得焦点之前检测大小,然后增加大小并将右边距设置为新大小和旧大小之间的差异(从而使渲染器将其视为与获得焦点之前相同的“宽度”).位置：相对是这样,元素宽度不会影响td宽度(只要右边距设置为负).

原文地址：https://www.jb51.cc/css/215045.html