[Typo3] COA: Superimposed Text over Image

[christian reiter]

Hello,

Your TS is using the IMAGE object. As I understand this, it is fully
intended to deliver back a complete <img src=."..">  tag.
This is however not what you need, when you want to dynamically define a CSS
background.
You should have a look at IMG_RESOURCE in the TSref document

"IMG_RESOURCE: Returns only the image-reference, possibly wrapped with
stdWrap. May be used for putting background images in tables or table-rows
or to import a image in your own include-scripts."

This will let you acheive the desired effect, it has worked for me in a
similar application as well.

Greetings,

Christian Reiter


"Bert Hiddink" <hiddink at bendoo.com> schrieb im Newsbeitrag
news:mailman.7884.1134660056.24100.typo3-english at lists.netfielders.de...
> Hello!
>
> Using CSS, I would like to achieve that on a per page basis an image is
> shown with a superimposed text.
>
> I have got the following TS:
> ...
> temp.BEELDMERK = COA
> temp.BEELDMERK {
>   10 = IMAGE
>   10.alttext.cObject = TEXT
>   10.alttext.cObject.value = {page:title}
>   10.alttext.cObject.insertData = 1
>   10.file.maxW = 296
>   10.file.import {
>     cObject = TEXT
>     cObject.value = fileadmin/beeldmerken/1.jpg
>     cObject.override {
> required = 1
> data = levelmedia: -1, "slide"
> wrap = uploads/media/ |
> listNum = 0
>     }
>   }
>   10 {
>     stdWrap.required = 1
>     stdWrap.wrap (
> <td width="296" align="left" valign="top"> | Superimposed Text</td>
>     )
>   }
> }
> ...
>
> Evidently, the above does not give the desired result as it just prints
> the image attached to the page and then the text beneath. So I would
> like to add some CSS, based on the following:
>
> CSS-snippet:
>
> div#test {
>      background-repeat: no-repeat;
>      height: 500px;
>      width: 380px;
> }
>
> TS-snippet:
>
>   10 {
>     stdWrap.required = 1
>     stdWrap.wrap (
> <td width="296" align="left" valign="top">
>          <div id="test" style="background-image: url(/images/ |
> ;">Superimposed Text</div>
> </td>
> )
>
> However, the above does not work as the image-object gets printed as
> <img src="myimage.jpg"> which will always render wrong HTML-code.
>
> Any ideas how to tackle this problem?
>
> Many thanks in advance!
>
> grt,
> -brt
>
> Bert Hiddink
>