Question

我正在寻找高低，以实现在这个小提琴中所做的事情： http://jsfiddle.net/wNTe6/1/

我对 Extjs -Textarea需要相同的效果。

（背景图片似乎已过时，我使用的是随机图片的图片网址）

我需要一个带有（背景？ - ）图像（中间/中间）和文本的teaxtarea。文本应该是可滚动的，但必须在图像后面消失。

此刻，文字正在我的背景图像上滚动（这是可以理解的）。

我的textarea（Extjs）：

var txtField = Ext.create('Ext.form.field.TextArea', {
name: 'transitionTextArea',
width: transWidth,
height: 100,
border: false,
value: 'Transition Transition Transition Transition Transition Transition',
readOnly: true,
fieldCls: 'transition-style'
});

CSS-类别：

.transition-style {
background-image: url('../images/icons/processControl/transition_160x32.png');
background-repeat: no-repeat;
text-align: center;
vertical-align: middle;
border: 0px;
padding-top: 30px;
}

有人可以帮助我吗？

任何帮助都将受到高度赞赏！

-nemesis -

Answer 1

好吧，我会试一试，但它不是很优雅。

这是Fiddle。

HTML中的更改。

<div class='imgdiv'>
    <img src='http://minionslovebananas.com/images/check-in-minion.jpg' width='100' height='120'>
    </div>

CSS的变化。

.imgdiv {
    margin: 40px auto;
    position: relative;
    top: 20%;
    left: 5%;
    border: 1px solid red;
    height: 120px;
    width: 100px;
        }

使外部div与可滚动div具有相同的高度，但稍微宽一点以不覆盖滚动条。让它的位置绝对。

将图像插入div并使div位置相对，然后可以移动它。

我敢打赌有人可以给我们一个很好的ELEGANT解决方案。

Extjs 4.2.2 - textarea中图像后面的可滚动文本

1 个答案: