在文本框焦点上显示框，包装文本框 [英] Show box on textbox focus, wrapping the textbox

问题描述

实际上，很容易向你展示我想实现的目标，而不是试图解释。

状态1：

字段Responsibles没有焦点。很简单。

状态2：

字段Responsibles获得焦点。

显示灰色框并定位它没有问题。问题是文本框显示在框内，但仍保持其当前位置。

当文本框被定位为绝对（尝试z-index）时，

任何想法任何人？

解决方案

您不需要给文本框绝对位置。只需给它的位置：相对和设置zIndex，所以它在灰色框的顶部。如果它有位置：static（默认）zIndex将不工作。

Actually it's a lot easier to show you what I want to achieve instead of trying to explain.

State 1:

The field Responsibles hos no focus. Pretty simple.

State 2:

The field Responsibles got focus. A div shows up around the textbox and the text.

It's no problem showing the gray box and position it. The problem is to have the textbox show up inside the box, but still maintain it's current position.

When the textbox is being positioned absolute (tried z-index), the content is being messed up ofcourse.

I'm using jQuery.

Any ideas anyone?

解决方案

You don't need to give the textbox an absolute position. Just give it position: relative and set the zIndex so it comes on top of the gray box. If it has position: static (default) zIndex won't work.

这篇关于在文本框焦点上显示框，包装文本框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！